JS项目
假定班上有 60 名同学，现制作一个提问选择器，如下图所示。单击“开始”按钮在页面随机显示 1 ~ 60 的学号，单击“停止”按钮在页面显示选中学号。 要求： (1) 页面样式参数设置： 1.1、输出框的高度和宽度分别为：500px 和 600px 1.2 、数字居中显示，字体大小：360px (2) 随机数字产生的时间间隔为 60ms (3) 显示框默认值为 0
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>随机选号器</title>
<link rel="stylesheet" href="css/change.css" type="text/css" />
<style type="text/css">
.text1 {
height: 500px;
width: 600px;
font-size: 360px;
text-align: center;
}
.text2 {
position: relative;
top: 40px;
left: -90px;
height: 40px;
width: 100px;
}
.text3 {
position: relative;
top: 40px;
left: 90px;
height: 40px;
width: 100px;
}
div {
text-align: center;
}
</style>
</head>
<script>
var timer;
//开始
function startText() {
var num = Math.floor(Math.random() * 61);
document.getElementById("myText").value = num;
timer = setTimeout("startText()", 60);
}
//暂停
function stopText() {
clearTimeout(timer);
}
</script>
<body>
<div>
<form>
<input type="text" class="text1" value="0" id="myText" /><br />
<input type="button" class="text2" value="开始" onclick="startText()" />
<input type="button" class="text3" value="停止" onclick="stopText()" />
</form>
</div>
<script type="text/javascript" src="js/p1.js"></script>
</body>
</html>
