使用js实现点击开始抽取随机学员学号
js代码
let _active = document.getElementById('active')
let _start = document.getElementById('start')
let n = 0
function btn() {
// 获取按钮
let a = _start.innerHTML
if (a == "开始") {
// 更新按钮
_start.innerHTML = "暂停"
n = setInterval(function () {
let sum = Math.floor(Math.random() * 100000)
if (sum > 10000) {
_active.innerHTML = +sum
}
}, 100)
} else {
_start.innerHTML = "开始"
clearInterval(n);
}
}
html 代码
<div class="box">
<div id="active">等待抽取学生</div>
<button onclick="btn()" id="start">开始</button>
</div>
css代码
.box {
width: 300px;
text-align: center;
margin: 50px auto;
}
#active {
width: 300px;
height: 300px;
border: 2px solid rgb(38, 227, 24);
border-radius: 200px;
text-align: center;
line-height: 300px;
font-size: 25px;
color: rgb(61, 6, 178);
background-color: rgb(238, 234, 234);
}
button {
width: 120px;
height: 50px;
margin-top: 20px;
font-size: 20px;
}