Html
<button id="start">开始点名</button>
<button id="end">结束点名</button>
<div id="name"></div>
CSS
#name{
width: 135px;
text-align: center;
padding-top:10px;
}
JS
#name{
window.onload = function () {
var start = document.getElementById('start');
var end = document.getElementById('end');
var name = document.getElementById('name');
var nameArr = ['Leon','Allen','Ella','Lee','Howard'];
var timer = null;
// 开始点名
start.onclick = function () {
// 清除定时器
clearInterval(timer);
// 设置定时器
timer = setInterval(function () {
// 设置随机数
var s_index = parseInt(Math.random()*nameArr.length);
var s_name = nameArr[s_index];
console.log(s_name);
name.innerText = s_name;
},20)
};
// 结束点名
end.onclick = function () {
clearInterval(timer);
}
}
}
