用angularjs 模拟的ul li下拉框怎么实现点击空白处消失
发布网友
发布时间：2022-04-22 19:32
共1个回答
热心网友
时间：2022-04-22 21:01
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>test</title>
<script type="text/javascript" src="angular.min.js"></script>
<script>
var myApp = angular.mole("myApp", []);
myApp.controller("testCtrl", function($scope){
$scope.data = [0,1,2,3,4];
$scope.isCurrent = function(index){
$scope.bg = [];
$scope.bg[index] = 'current';
}
});
</script>
<style>
ul { margin:100px auto; width:1120px; list-style:none}
ul li { display:block; width:200px; height:200px; background:#efefef; border:solid 1px #000; float:left; margin:10px; cursor:pointer}
.current { background:#f00}
</style>
</head>
<body ng-app="myApp">
<ul ng-controller="testCtrl">
<li ng-repeat="item in data" ng-class="bg[$index]" ng-click="isCurrent($index)"></li>
</ul>
</body>
</html>
