基于JS实现的随机数字抽签实例
话不多说,附上源码,仅供大家参考
<!DOCTYPEhtml>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<scriptsrc="Scripts/jquery-1.10.2.js"></script>
<scripttype="text/javascript">
varnumArray=newArray();
varpersonNum=30;
$(function(){
for(vari=0;i<personNum;i++){
numArray[i]=i;
}
$("li").click(function(){
varn=Math.floor(Math.random()*numArray.length+1)-1;//生成随机数
$(this).text(numArray[n]);
numArray.splice(n,1);//移除随机数
});
$("#btnStart").click(function(){
vartotalArray=newArray();
$("li").each(function(i,v){
totalArray[i]=v.innerText;
});
varn=Math.floor(Math.random()*totalArray.length+1)-1;//生成随机数
this.value=totalArray[n];
$("li").each(function(i,v){
if(v.innerText==$("#btnStart").val()){
this.style.background="red";
}
else
{
this.style.background="white";
}
});
});
});
</script>
<styletype="text/css">
ul{
/*display:block;
float:left;*/
}
ulli{
width:150px;
height:150px;
line-height:150px;
border:1pxsolidgray;
float:left;
margin-left:10px;
margin-top:10px;
list-style-type:none;
text-align:center;
font-size:20px;
}
#btnStart{
width:100px;
height:30px;
margin-left:10px;
margin-top:10px;
}
</style>
</head>
<body>
<div>
<ul>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
</ul>
<ul>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
</ul>
<ul>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
</ul>
<ul>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
</ul>
<ul>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
<li>clickme!</li>
</ul>
</div>
<inputid="btnStart"type="button"value="Start"/>
</body>
</html>
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持毛票票!