您的位置：首页 > 其它

随机选择案例

2016-07-12 21:59 411 查看

<!DOCTYPE HTML>

<html ng-app="myApp1">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<style type="text/css">
*{
margin:0;
padding:0;
list-style:none;
}
.boxin{
padding:0 20px;
}
.boxin span{
position:relative;
top: -1px;

left: 6px;

}

label{

width: 100%;

height: 100%;

display: block;

}

.boss{

color:red;

font-size:18px;

font-weight:bold;

}

</style>

<script src="angular.min.js"></script>

<script>

var m1 = angular.module('myApp1',[]);

m1.controller('Aaa',['$scope',function($scope){


$scope.adminx=[

"人物一",

"人物二",

"人物三",

"人物四",

"人物五",

"人物六",

"人物七",

"人物八",

"人物九",

"人物十"
]

$scope.adminy=[

"哈哈一",

"哈哈二",

"哈哈三",

"哈哈四",

"哈哈五",

"哈哈六",

"哈哈七",

"哈哈八",

"哈哈九",

"哈哈十"
]

y = $scope.adminy.length-1;

//取一个范围内的随机数函数

function rnd(n,m){

return parseInt(n+Math.random()*(m-n));//随机数函数Math.random()是大于等于0 到1的一个随机数不等于1

};



/* alert(parseInt(0+Math.random()*(x-0)));

alert($scope.adminx[parseInt(0+Math.random()*(x-0))]);*/



$scope.confirm = function(){

$scope.obValue = [];
var arrays = document.getElementsByClassName("ipt");
for(var i = 0; i < arrays.length;i++){
var single = arrays[i];
if(single.checked){
$scope.obValue.push($scope.adminx[i]);

}

}

if($scope.obValue.length <= 0){

alert("请选择");

return;

}
x = $scope.obValue.length;
var randomInt = parseInt(0+Math.random()*(x-0));
alert($scope.obValue[randomInt]);

}



}]);

</script>

</head>

<body>

<div ng-controller="Aaa">

<div class="box" style="width:100%;height:660px;background:#000;opacity:0.6;padding-top:10px;">

<div class="boss">

<p>1</p>

<p>2</p>

</div>

<div class="boxin" style="width:600px;padding:60px 40px;border:2px solid #fff;overflow:hidden;margin:0px auto;position:relative;">
<ul style="z-index:1;color:#fff;width:40%;float:left;">
<li ng-repeat="admin in adminx" style="line-height:30px;border-bottom:1px solid #fff;cursor:pointer;">
<label ><input type="checkbox" class="ipt" index = {{$index}}><span>{{admin}}</span></label>
</li>
</ul>
<ul style="z-index:1;color:#fff;width:40%;float:right;">
<li ng-repeat="admin in adminy" style="line-height:30px;border-bottom:1px solid #fff;cursor:pointer;">
<label ><input type="checkbox" ><span>{{admin}}</span></label>
</li>
</ul>
<div style="position:absolute;bottom:10px;width: 100%;left: 43%;text-align: center;">
<p style="width:100px;height:40px;line-height:40px;background:orange;cursor:pointer;" ng-click="confirm()">确定</p>
</div>
</div>

</div>

</div>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航