用angularjs实现点击第一个div,让第二个div的背景也变成第一个div的背景
结构如下<divng-style="background-color:{{div1Bg}}"style="background:#039">div1</div><divn...
结构如下
<div ng-style="background-color: {{div1Bg}}" style="background:#039">div1</div>
<div ng-style="background-color: {{div2Bg}}">div2</div> 展开
<div ng-style="background-color: {{div1Bg}}" style="background:#039">div1</div>
<div ng-style="background-color: {{div2Bg}}">div2</div> 展开
展开全部
你可以这样
<html ng-app>
<head>
</head>
<style>
.red {
background-color : red;
}
.orange {
background-color: orange;
}
</style>
<body>
<div ng-controller="TestController">
<div ng-class="{true: 'red', false: 'orange'}[isChange]" ng-click="changeBgColor()">div1</div>
<div ng-class="{true: 'red', false: 'orange'}[isChange]">div2</div>
</div>
<script src= "js/angular.js"></script>
<script Type= "text/javascript" >
function TestController ($scope) {
$scope.isChange = false;
$scope. changeBgColor = function(row) {
$scope.isChange = !$scope.isChange;
} ;
}
</script>
</body>
</html>
追问
我不能自己设定颜色,而是点击获取第一个div的背景颜色,将第二个div的背景改变成一样的,
追答
那你可以这样写:
<html ng-app>
<head>
</head>
<style>
.red {
background-color : red;
}
.orange {
background-color: orange;
}
</style>
<body>
<div ng-controller="TestController">
<div class="orange" ng-click="changeBgColor($event.target)">div1</div>
<div ng-style="{'background-color':mycolor }">div2</div>
</div>
<script src= "js/angular.js"></script>
<script Type= "text/javascript" >
function TestController ($scope) {
$scope.mycolor = "";
$scope. changeBgColor = function(dom) {
var oStyle = dom.currentStyle ? dom.currentStyle : window.getComputedStyle(dom, null);
if (oStyle.getPropertyValue) {
$scope.mycolor = oStyle.getPropertyValue("background-color"); //getPropertyValue
} else {
$scope.mycolor = oStyle.getAttribute("backgroundColor"); //getAttribute
}
};
}
</script>
</body>
</html>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询