这篇文章将为大家详细讲解有关使用JavaScript实现简单随机点名器的案例,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
& lt; html lang=皕h"比;
& lt; head>
,& lt; meta charset=癠TF-8"比;
,& lt; meta name=皏iewport",内容=翱矶?设备宽度,初始=1.0,比;
,& lt; meta http-equiv=癤-UA-Compatible",内容=癷e=edge"比;
,& lt; title>随机抽签& lt;/title>
& lt;/head>
& lt; body>
,& lt; center>
,& lt; div id=癲",祝辞& lt; !——,设置背景框颜色和长度,——比;
,& lt; h2 id =, & # 39;名字# 39;祝辞& lt;/h2>, & lt; !——,用于显示随机的人名,——比;
,& lt;/div>
,& lt; div>
,& lt; button id =, & # 39;开始# 39;,类型=癰utton"在开始& lt;/button>
,& lt;/div>
,& lt; div>
,& lt; button id =, & # 39;临时# 39;,类型=癰utton"祝辞暂停& lt;/button>
,& lt;/div>
,& lt;/center>
& lt;/body>
& lt;/html>
& lt; script 类型=拔谋?javascript"比;
,window=function () {
,var names =,(& # 39;名字# 39;& # 39;名字# 39;,& # 39;名字# 39;,& # 39;名字# 39;,& # 39;名字# 39;];,//人名数组
,var clors =, (& # 39; # EE0000& # 39;, & # 39; # CAE1FF& # 39;, & # 39; # 008 b8b& # 39;, & # 39; # CDC9C9& # 39;, & # 39; # F0F8FF& # 39;];//颜色数组
,var name =, . getelementbyid(& # 39;名字# 39;);,//获取id为名称的元素
,var d =, . getelementbyid (& # 39; d # 39;);
,var temp =, . getelementbyid(& # 39;临时# 39;);
,var startR =, 1,,//记录计时器的序号
,var start =, . getelementbyid(& # 39;开始# 39;);
,function 随机(){//产生随机数,并更改h2中的内容与颜色
,var nNum =, Math.floor (math . random() * 5),,//这里的5为你当前人名的数量
,var cNum =, Math.floor (math . random () * 5);=,name.innerHTML 名称(nNum);=,,d.style.color clors [cNum];
,}
,start.onclick =, function(){,//单击开始方法
,如果(startR ==, 1),//不加限制,多次点击开始会有多个计时器启动=,,startR setInterval(随机,25);//设置计时器,每0.025秒执行一次
,}
,temp.onclick =, function(){,//单击暂停方法
,clearInterval (startR);=,startR 1;
,}
,}
& lt;/script> 当前代码仅实现了随机点名的功能,没有做任何界面美化。
具体展示
关于“使用JavaScript实现简单随机点名器的案例”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看的到。
