单击时更改按钮的背景颜色 [英] Change background colour of button when clicked
本文介绍了单击时更改按钮的背景颜色的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想改变按钮被点击时的背景颜色
HTML 代码:
<button type="button" class="btn btn-default" ng-click="style1()">摄氏按钮><button type="button" class="btn btn-default" ng-click="style2()">华氏度按钮>
应更改按钮背景颜色的 Angular 代码:
$scope.style{};$scope.style2{}
解决方案
你应该这样做
angular.module('myapp',[]).controller('testCtrl', function($scope){});代码>
<头><script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>头部><body ng-controller="testCtrl"><div class="btn-group" ng-init="style={'background-color' : 'green'}"><button type="button" class="btn btn-default" ng-style="style1"ng-click="style1=style; style2=null">摄氏度</button><button type="button" class="btn btn-default" ng-style="style2"ng-click="style2=style; style1=null">华氏度</button>
<br></html>
I would like to change the background colour of a button when it is clicked
HTML code:
<div class="btn-group">
<button type="button" class="btn btn-default" ng-click="style1()">
Celsius
</button>
<button type="button" class="btn btn-default" ng-click="style2()">
Fahrenheit
</button>
</div>
Angular code where the background colours of the buttons should be changed:
$scope.style
{
};
$scope.style2
{
}
解决方案
You should do it this way
angular.module('myapp',[]).controller('testCtrl', function($scope){});
<html ng-app="myapp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-controller="testCtrl">
<div class="btn-group" ng-init="style={'background-color' : 'green'}">
<button type="button" class="btn btn-default" ng-style="style1"
ng-click="style1=style; style2=null">Celsius</button>
<button type="button" class="btn btn-default" ng-style="style2"
ng-click="style2=style; style1=null">Fahrenheit</button>
</div>
<br>
</body>
</html>
这篇关于单击时更改按钮的背景颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文