js双色球抽奖

Html

Css

* {
	margin:0;
	padding:0
}
ul {
	list-style:none
}
.lucky_box {
	width:500px;
	height:300px;
	border:1px solid red;
	border-radius:5px;
	padding:20px;
	margin:100px auto
}
h2 {
	text-align:center;
	height:60px;
	color:red
}
#lucky_ball_list {
	height:50px;
	padding-left:65px;
	margin-bottom:30px;
}
#lucky_ball_list li {
	float:left;
	height:40px;
	line-height:40px;
	width:40px;
	text-align:center;
	font-size:24px;
	border:2px solid red;
	margin-right:20px;
	color:red
}
button {
	height:40px;
	width:100px
}
p {
	word-break:break-all;
	font-size:20px;
	padding:10px;
	color:#333;
}

window.onload = function() {
    var oBtn = document.getElementById('btn');
    var oUl = document.getElementById('lucky_ball_list');
    var aLi = document.getElementsByTagName('li');
    var info = document.getElementById('info');

//从33个红球中开6个号码
    oBtn.onclick = function() {
        info.innerHTML = "";

var all_ball = []; //球池
        //生成33个球
        for (var i = 1; i < 34; i++) {
            all_ball.push(i < 10 ? "0" + i : i);
        };

var j = 0; //定时器计数器
        var timer1, timer2; //声明两个定时器变量

//滚动函数
        function run(n) {
            clearInterval(timer1);
            timer1 = setInterval(function() {
                for (var i = n; i < aLi.length; i++) {
                    aLi[i].innerHTML = parseInt(Math.random() * all_ball.length);
                };
            }, 50);
        };

run(j); //全部开始滚动

timer2 = setInterval(function() {
            var index = parseInt(Math.random() * all_ball.length); //随机抽取索引值 0-32 
            var n = all_ball.splice(index, 1); //删除 并返回
            aLi[j].innerHTML = n;
            j++;
            run(j);
            if (j == 6) {
                clearInterval(timer1);
                clearInterval(timer2);
                info.innerHTML = "还剩 : " + all_ball;
            }
        }, 800);
    }

}

↑上面代码改变，会自动显示代码结果 jQuery调用版本：1.11.3

立即下载

js双色球抽奖



代码描述：js双色球随机滚动抽奖

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

PROMULGATOR

老头子

相关代码

双色球大开奖

js双色球抽奖

最新