<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>抽签</title>
<script src="jquery-3.4.1.min.js"></script>
</head>
<script>
$(function () {
var names = [
"张三",
"李四",
"诸葛亮",
"刘备",
"曹操",
"韩非",
"张良",
"卫庄",
"盖聂",
];
var time;
var index;
$("#start").prop("disabled", false);
$("#stop").prop("disabled", true);
$("#start").click(function () {
time = setInterval(function () {
$("#start").prop("disabled", true);
$("#stop").prop("disabled", false);
index = Math.floor((Math.random() * 10) + 1);
$("#name").prop("value", names[index]);
});
});
$("#stop").click(function () {
clearInterval(time);
$("#start").prop("disabled", false);
$("#stop").prop("disabled", true);
});
});
</script>
<body>
<input type="text" id="name" value="张三" style="width: 250px;height: 50px;border: 2px solid black;text-align: center;
margin-left:450px;margin-top: 100px;red;color: white; font-size: 26px">
<input type="button" id="start" value="开始" style="width: 70px;height: 35px; margin-left: 100px">
<input type="button" id="stop" value="结束" style="width: 70px;height: 35px;">
</body>
</html>