随机数抽奖
<body>
<div id="wrap">
<button id="btn">开始抽奖</button>
<ul id="ul1">
<li>鼠标</li>
<li>1000万</li>
<li>100优惠卷</li>
<li>很遗憾</li>
<li>键盘</li>
<li>iphoneX</li>
<li>很遗憾</li>
<li>迪拜10日游</li>
<li>很遗憾</li>
</ul>
</div>
<!-- 提示信息 -->
<div id="tooltips">
<div id="info">
<div class="title">信息</div>
<div class="content" id="content">恭喜你，中奖了</div>
<div class="btn">
<button id="confirm">确定</button>
</div>
</div>
</div>
<script type="text/javascript">
var oBtn = document.getElementById("btn")
var aLi = document.getElementsByTagName("li")
var num = 0 //第一次点击抽奖结束时，num = 27，继续点击第二次时，num从27开始往上加1，
// console.log(randomInt)
var timer = null
var oContent = document.getElementById("content")
var oTooltips = document.getElementById("tooltips")
var oConfirm = document.getElementById("confirm")
oBtn.onclick = function(){
var randomInt = getRandomInt(26,35)
console.log(randomInt)
clearInterval(timer)
timer = setInterval(function(){
changeColor(aLi,num%9)
num++ // num = 28,29,30,31,32,33,34,35,36,37,38,39,40,41,42
if(num>35){ ////getRandomInt最大值为35， 当var nowIndex = 35时，nowIndex++，会使nowIndex的数值大于getRandomInt的最大值，无法执行下列语句
num = 0
}
if(num === randomInt){
clearInterval(timer)
changeColor(aLi,num%9)
console.log(aLi[randomInt].innerHTML)
if(aLi[num%9].innerHTML == "很遗憾"){
oContent.innerHTML = "很遗憾，您没有中奖"
}else{
oContent.innerHTML = "恭喜你，你抽中了" + aLi[num%9].innerHTML
}
oTooltips.style.display = "block"
}
},100)
}
function getRandomInt(min,max){
return Math.floor(Math.random()*(max - min + 1) + min)
}
oConfirm.onclick = function(){
oTooltips.style.display = "none"
}
function changeColor(aLi,num){
for(var i = 0;i<aLi.length;i++){
aLi[i].style.backgroundColor = "white"
}
aLi[num].style.backgroundColor = "red"
}
