编程 Javascript

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>

- Author -

junjie

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

jQuery 操作XML入门

Dec 25 Javascript

发布一个基于javascript的动画类 Fx.js

Nov 05 Javascript

seajs1.3.0源码解析之module依赖有序加载

Nov 07 Javascript

js克隆对象、数组的常用方法介绍

Sep 26 Javascript

jquery获得option的值和对option进行操作

Dec 13 Javascript

轻松学习jQuery插件EasyUI EasyUI创建树形菜单

Nov 30 Javascript

js实现网页收藏功能

Dec 17 Javascript

深入理解Angular.JS中的Scope继承

Jun 04 Javascript

Vue微信项目按需授权登录策略实践思路详解

May 07 Javascript

angular 组件通信的几种实现方式

Jul 13 Javascript

浅谈vux之x-input使用以及源码解读

Nov 04 Javascript

Element-ui 自带的两种远程搜索(模糊查询)用法讲解

Jan 29 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