JavaScript和随机数制作简易的双色球彩票

来源:互联网 发布:linux nmon安装 编辑:程序博客网 时间:2024/06/01 07:47
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>双色球</title>
<link rel="stylesheet" href="css/doubleColorBall.css">

<style>

#redball0,#redball1,#redball2,#redball3,#redball4,#redball5{
text-align: center;
float: left;
    margin-left: 2px;
    width: 40px;
height: 40px;
border-radius: 50%;
border:2px solid #f00;
line-height:40px;
}
#blueball {
text-align: center;
margin-left: 278px;
width: 40px;
height: 40px;
border-radius: 50%;
border:2px solid #00f;
line-height:40px;
}
button {
    margin-left: 70px;
    margin-top: 10px;
}

</style>


<script type="text/javascript">
  //定义一个函数
       function getCode(){
        //定义一个红色球的数组(1~33)
         var reds=[parseInt(Math.random()*33+1)];//第一个红色球的值
          while(reds.length<6){//判断后面五个红色球的值
         //定义一个r与reds[]的值相比较,若r=reds[],则跳出循环,若不相等,则将r的值赋到reds[]里面
          var r = parseInt(Math.random()*33+1);
            for(var i=0;i<reds.length;i++){
               if(r==reds[i]){
                  break;
               }else if(i==reds.length-1){
  reds.push(r);//push() 向数组添加元素
               }
            }
          }
        //给红色球排序(升序)
         function compare(a,b){return a-b};
           reds.sort(compare);
             for(var a=0;a<reds.length;a++){
                document.getElementById('redball'+a+"").innerHTML=reds[a];
             }
            //定义一个蓝色球(1~16)
            document.getElementById('blueball').innerHTML=parseInt(Math.random()*16+1);


       }




</script>
</head>
<body>
      <div id="redball0"></div>  
         <div id="redball1"></div>
         <div id="redball2"></div>
         <div id="redball3"></div>
         <div id="redball4"></div>
         <div id="redball5"></div>
         <div id="blueball"></div>
   <button type="button" onclick="getCode()">点我产生随机的双色球彩票</button>
 
</body>
</html>
原创粉丝点击