javascript实现的一个随机点名功能


Posted in Javascript onAugust 26, 2014

这个其实是对JS随机数的一个练习方式,先把所有人得名字预先写好在一个数组里,然后让数组里的值快速的显示在区域内,当你按停的时候滚动就会停止达到随机效果。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title>JS写的随机点名 - 琼台博客</title>
	<script type="text/javascript">
	var isRun=true;
	var a = ["张三","李四","王五","赵六"];	
	var a2 = new Array();
	function action(str){
		var s = document.getElementById("bt").value;
		if(s=="开始"){
			isRun=true;
			run();
			document.getElementById("bt").value="结束";
		}else{
			isRun=false;
			document.getElementById("bt").value="开始";
		}
	}
	function run(){
		var i = Math.floor(Math.random() * a.length+ 1)-1;
		document.getElementById("show").innerHTML=a[i];
		if(isRun==false){
			var b =true;
			for(var j in a2){
				if(a2[j]==i){
					b=false;
				}
			}
			if(b){
			 	a2[a2.length]=i;
				return;
			}
		}
		setTimeout("run()",10);
	}
</script>

</head>

<body>
	<div style="text-align:center; margin-top:100px;width:100%;">
		<div id="show" style="margin:auto;font-size:50px;width:100px;height:50px; background:#FFEEFF"></div>
		<div style="margin-top:20px;">
			<input id="bt" type="button" onclick="action()" value="开始"/>
		</div>
	</div>
</body>
</html>
Javascript 相关文章推荐
javascript 正则替换 replace(regExp, function)用法
May 22 Javascript
图片img的src不变让浏览器重新加载实现方法
Mar 29 Javascript
使用insertAfter()方法在现有元素后添加一个新元素
May 28 Javascript
每天一篇javascript学习小结(RegExp对象)
Nov 17 Javascript
js canvas仿支付宝芝麻信用分仪表盘
Nov 16 Javascript
Angular2学习笔记——详解NgModule模块
Dec 02 Javascript
微信小程序使用request网络请求操作实例
Dec 15 Javascript
Angular 5.x 学习笔记之Router(路由)应用
Apr 08 Javascript
解决Vue使用swiper动态加载数据,动态轮播数据显示白屏的问题
Sep 27 Javascript
详解离线安装npm包的几种方法
Nov 25 Javascript
详解Vue.js中引入图片路径的几种方式
Jun 17 Javascript
Element Notification通知的实现示例
Jul 27 Javascript
JS按回车键实现登录的方法
Aug 25 #Javascript
在JavaScript中重写jQuery对象的方法实例教程
Aug 25 #Javascript
一个支持任意尺寸的图片上下左右滑动效果
Aug 24 #Javascript
jquery 取子节点及当前节点属性值的方法
Aug 24 #Javascript
在JS数组特定索引处指定位置插入元素的技巧
Aug 24 #Javascript
js获取checkbox复选框选中的选项实例
Aug 24 #Javascript
jQuery异步加载数据并添加事件示例
Aug 24 #Javascript
You might like
php5 mysql分页实例代码
2008/04/10 PHP
PHP通过session id 实现session共享和登录验证的代码
2012/06/03 PHP
php短网址和数字之间相互转换的方法
2015/03/13 PHP
Yii2.0预定义的别名功能小结
2016/07/04 PHP
Laravel实现短信注册的示例代码
2018/05/29 PHP
Jquery 高亮显示文本中重要的关键字
2009/12/24 Javascript
js 创建书签小工具之理论
2011/02/25 Javascript
解析ScrollPic在ie8下只滚动一遍,然后变为空白 ie6,ie7,chrome,firefox正常
2013/06/26 Javascript
jquery设置text的值示例(设置文本框 DIV 表单值)
2014/01/06 Javascript
JavaScript中实现sprintf、printf函数
2015/01/27 Javascript
11种ASP连接数据库的方法
2015/09/18 Javascript
跟我学习javascript的隐式强制转换
2015/11/16 Javascript
JavaScript驾驭网页-CSS与DOM
2016/03/24 Javascript
jQuery点击其他地方时菜单消失的实现方法
2016/04/22 Javascript
JavaScript校验Number(4,1)格式的数字实例代码
2017/03/13 Javascript
JS实现多级菜单中当前菜单不随页面跳转样式而发生变化
2017/05/30 Javascript
从setTimeout看js函数执行过程
2017/12/19 Javascript
Laravel整合Bootstrap 4的完整方案(推荐)
2018/01/25 Javascript
js实现鼠标拖拽缩放div实例代码
2019/03/25 Javascript
[04:19]DOTA2亚洲邀请赛 现场花絮
2015/03/11 DOTA
[53:52]OG vs EG 2018国际邀请赛淘汰赛BO3 第二场 8.23
2018/08/24 DOTA
[02:04]2020年夜魇暗潮预告片
2020/10/30 DOTA
浅谈Python中的闭包
2015/07/08 Python
Python设计模式之命令模式简单示例
2018/01/10 Python
Django跨域请求CSRF的方法示例
2018/11/11 Python
如何使用Python 打印各种三角形
2019/06/28 Python
python脚本监控logstash进程并邮件告警实例
2020/04/28 Python
pycharm sciview的图片另存为操作
2020/06/01 Python
css3动画过渡实现鼠标跟随导航效果
2018/02/08 HTML / CSS
Servlet都有哪些方法?主要作用是什么?
2014/03/04 面试题
小组口号大全
2014/06/09 职场文书
本科应届生自荐信
2014/06/29 职场文书
领导班子四风对照检查材料
2014/09/23 职场文书
2015年元旦主持词开场白
2014/12/14 职场文书
民政局2016年“六一”儿童节慰问活动总结
2016/04/06 职场文书
如何利用python实现列表嵌套字典取值
2022/06/10 Python