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 相关文章推荐
基于jsTree的无限级树JSON数据的转换代码
Jul 27 Javascript
异步加载script的代码
Jan 12 Javascript
在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法
May 24 Javascript
document.getElementBy(&quot;id&quot;)与$(&quot;#id&quot;)有什么区别
Sep 22 Javascript
javascript通过className来获取元素的简单示例代码
Jan 10 Javascript
js实现左侧网页tab滑动门效果代码
Sep 06 Javascript
JavaScript实现页面跳转的几种常用方式
Nov 28 Javascript
js添加绑定事件的方法
May 15 Javascript
angularjs使用directive实现分页组件的示例
Feb 07 Javascript
Node.js简单入门前传
Aug 21 Javascript
JS实现按钮添加背景音乐示例代码
Oct 17 Javascript
基于mpvue小程序使用echarts画折线图的方法示例
Apr 24 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
php date与gmdate的获取日期的区别
2010/02/08 PHP
php定义参数数量可变的函数用法实例
2015/03/16 PHP
Laravel框架实现利用中间件进行操作日志记录功能
2018/06/06 PHP
Laravel 创建指定表 migrate的例子
2019/10/09 PHP
JavaScript 构造函数 面相对象学习必备知识
2010/06/09 Javascript
放弃用你的InnerHTML来输出HTML吧 jQuery Tmpl不详细讲解
2013/04/20 Javascript
javascript放大镜效果的简单实现
2013/12/09 Javascript
Jquery 动态生成表格示例代码
2013/12/24 Javascript
jquery实现用户信息修改验证输入方法汇总
2015/07/18 Javascript
基于jQuery+PHP+Mysql实现在线拍照和在线浏览照片
2015/09/06 Javascript
JS 对java返回的json格式的数据处理方法
2016/12/05 Javascript
JS完成画圆圈的小球
2017/03/07 Javascript
浅谈JS获取元素的N种方法及其动静态讨论
2017/08/25 Javascript
node通过npm写一个cli命令行工具
2017/10/12 Javascript
浅谈基于Vue.js的移动组件库cube-ui
2017/12/20 Javascript
Angular4 组件通讯方法大全(推荐)
2018/07/12 Javascript
微信jssdk逻辑在vue中的运用详解
2018/11/14 Javascript
详解javascript中var与ES6规范中let、const区别与用法
2020/01/11 Javascript
Python数据集切分实例
2018/12/08 Python
Python简单获取二维数组行列数的方法示例
2018/12/21 Python
python如何获取当前文件夹下所有文件名详解
2019/01/25 Python
linux安装python修改默认python版本方法
2019/03/31 Python
Python3.5集合及其常见运算实例详解
2019/05/01 Python
python3 使用traceback定位异常实例
2020/03/09 Python
基于Python正确读取资源文件
2020/09/14 Python
国际化的太阳镜及太阳镜配件零售商:Sunglass Hut
2016/07/26 全球购物
Petmate品牌官方网站:宠物用品
2018/11/25 全球购物
写给爸爸的道歉信
2014/01/15 职场文书
《雨点》教学反思
2014/02/12 职场文书
不打扫卫生检讨书
2014/02/12 职场文书
部门经理迟到检讨书
2015/02/16 职场文书
公司财务部岗位职责
2015/04/14 职场文书
2015年资料员工作总结
2015/04/25 职场文书
如何写好竞聘报告
2019/04/03 职场文书
干货分享:推荐信写作技巧!
2019/06/21 职场文书
Windows server 2016服务器基本设置
2022/08/14 Servers