随机点名器的实现

最新推荐文章于 2020-03-18 10:01:58 发布

高中不复，大学纷飞

最新推荐文章于 2020-03-18 10:01:58 发布

阅读量367

点赞数 1

文章标签：随机点名器

本文链接：https://blog.csdn.net/qq_44760912/article/details/102921508

版权

所有代码如下：
css样式可自行修改

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>点名器</title>
	<style>
		body {
			text-align: center;
			background-color: white;
		}
		#box {
			text-align: center;
			margin: auto;
			width: 660px;
			font-size: 66px;
			height: 94px;
			line-height: 94px;
			color: deepskyblue;
		}
		#bt {
			width: 200xp;
			color: skyblue;
			text-align: center;
			margin: 75px auto;
			cursor: pointer;
		}
	</style>
</head>

<body>
	<script>
		var namelist=["1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28","29","30"];
		var mytime=null;
		function doit() {
		//起初mytime非空
			var bt=window.document.getElementById("bt");
			if(mytime==null){
				bt.innerHTML="停止点名";
				show();
			}
			else 
			{
				bt.innerHTML="开始点名";
				clearTimeout(mytime);//清除动态
				mytime=null;
			}
		}
		function show() {
			var box=window.document.getElementById("box");
			var num=Math.floor((Math.random()*100000))%namelist.length;
			box.innerHTML=namelist[num];
			mytime=setTimeout("show()",1);//开始动态
		}
	</script>
	<h3 id="box">亲，你准备好了吗？</h3>
	<br><br>
	<div onClick="doit()" id="bt">开始点名</div>
</body>
</html>

高中不复，大学纷飞

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
随机点名器的实现

所有代码如下：css样式可自行修改<!doctype html><html><head><meta charset="utf-8"><title>点名器</title> <style> body { text-align: center; background-color: white...
复制链接

扫一扫