<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>彩票模拟</title>
<style>
.lottery_wrap{
width: 850px;
height: 100px;
border: 1px solid grey;
border-radius: 10px;
margin: 0 auto;
background: lightgrey;
position: relative;
}
p {
width: 80px;
height: 80px;
margin: 10px;
background: red;
display: inline-block;
text-align: center;
line-height: 80px;
border-radius: 50%;
font-size: 2.5em;
color: white;
}
#p6{
background: blue;
}
h1{
text-align: center;
}
#checkBall{
position: absolute;
top: 30px;
right: 10px;
border: 1px solid lightblue;
height: 40px;
background: red;
color: white;
font-size: 1.5em;
border-radius: 10px;
}
</style>
</head>
<body>
<h1>彩票模拟</h1>
<div class="lottery_wrap" id="lotteryWrap">
<input type="button" name="name" value="随机一注" id="checkBall" />
</div>
<script type="text/javascript">
var lotteryWarp = document.getElementById('lotteryWrap');
for ( var i = 0; i<7;i++){
var p = document.createElement('p');
lotteryWarp.appendChild(p);
p.id = 'p' + i;
}
function getRandomRedBall() {
var array = []; //创建数组用来存放随机生成的数字
var array1 = [];//创建对比数组用来判断生成的随机数是否重复
for (var i = 0; i < 6; i++) {
do { // 用do-while循环首先生成一个随机数
var number = Math.floor(Math.random() * 33 + 1); // 随机生成1~33的一个随机数
} while (array1[number] !== undefined); // 用对比数组来判断生成的数字是否重复;
array1[number] = '';
if (number < 10) { //判断数字如果是个位数则前面添加0
number = '0' + number;
}
array[i] = number;//将生成的不重复的数字放入数组中
}
array.sort(function (a, b) {
return a - b;
}) //把生成的数组按小到大排列
var redBall = document.getElementsByTagName('p');
for (var i = 0; i < 6; i++) {
redBall[i].innerHTML = array[i];//将数组中的数字依次放入6个红球中
}
return redBall;
}
function getRandomBlueBall() {
var blueBall = document.getElementById('p' + 6);
var number = Math.floor(Math.random() * 16 + 1);
if (number < 10) {
number = '0' + number;
}
blueBall.innerHTML = number;
return blueBall;
}
function getRandomBall() {
getBall = getRandomRedBall() + getRandomBlueBall();
return getBall;
}
getRandomBall(); //得到双色球
var checkBall = document.getElementById('checkBall');
var timer = setInterval('getRandomBall()',100);
isOn = true;
checkBall.onclick = function() {
isOn ? clearInterval(timer) : timer = setInterval('getRandomBall()',100);
isOn = !isOn;
}
</script>
</body>
</html>
转自:https://www.cnblogs.com/spring-qingfeng/p/5789326.html