js随机点名
定时器案例。
<!--
Author: XiaoWen
Create a file: 2016-12-08 12:27:32
Last modified: 2016-12-08 12:51:59
Start to work:
Finish the work:
Other information:
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>随机点名</title>
</head>
<body>
<div style="width:100px;height:100px;border:1px solid #ccc"></div>
<input type="button" value="开始">
<input type="button" value="停止">
<script>
var div=document.getElementsByTagName("div")[0];
var arr=["零","一","二","三","四","五","六","七","八","九"]
var a_ipt=document.getElementsByTagName("input");
var inter; //定时器的名字，这里要写在外面，否则外面的函数不能找到
a_ipt[0].onclick=function(){
clearInterval(inter) //先清除定时器，不然定时器会累加
inter=setInterval("fn1()",50); //为什么定时器里调用的函数名要加绰号？如果不加，浏览器看到 fn() 就直接执行 fn() 了。而看到被引号包围的 "fn()" 不会。
}
function fn1(){
div.innerHTML=arr[parseInt(Math.random()*10)]
}
a_ipt[1].onclick=function(){
clearInterval(inter)
}
</script>
</body>
</html>
js随机点名的更多相关文章
- js随机点名系统
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JS: 随机点名程序与万年历
随机点名程序 document.write(Math.random()); var stu = ["张三", "王五", "张二", &qu ...
- js 随机点名
1.对象构造函数 设置节点与人名 constructor({ printElement, startElement, stopElement , person }) { this.list = per ...
- 原生JS实现简易随机点名功能
定时器的工作原理,这里将用引用How JavaScript Timers Work中的例子来解释定时器的工作原理,该图为一个简单版的原理图.· 上图中,左侧数字代表时间,单位毫秒:左侧文字代表某一个操 ...
- js - 面向对象 - 小案例：轮播图、随机点名、选项卡、鼠标拖拽
面向对象 对象 : (黑盒子)不了解内部结构, 知道表面的各种操作. 面向对象 : 不了解原理的情况下 会使用功能 . 面向对象是一种通用思想,并非编程中能用,任何事情都能用. 编程语言的面向对象的特 ...
- 原生js实现简单的随机点名系统
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...
- javascript随机点名--案例
主要知识点涉及if选择结构判断语句.数组的定义.定时器.清除定时器.日期对象的使用. 1.HTML结构 <!DOCTYPE html> <html> <head> ...
- js 随机星星 document.createElement(); setAttribute()
js 随机星星 document.createElement(); setAttribute() <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...
- js随机更换
如果想实现“随机”切换图像,那么我们要使用到几个Math()对象 第一个是random()函数,函数的功能是产生随机数,如果书写为 var a=Math.random() 那么所产生的随机数是0-1( ...
随机推荐
- blob storage第一次亲密接触
由于azure上各个云服务都是分开的,所以当一个地方生成文件后,我在别的地方想要读取他就变得困难,不过azure上面有解决方案,就是azure blob storage. 在现有的订阅账号下,新建一个 ...
- Java 基础知识总结 (三、运算符)
三.Operators 运算符 Assignment Operators(赋值运算符) = += -= %= *= /= <<= >>= ...
- HttpServletRequest
javaweb学习总结(十)——HttpServletRequest对象(一) 一.HttpServletRequest介绍 HttpServletRequest对象代表客户端的请求,当客户端通过HT ...
- 在Mac OS X中配置Apache
启动Apache 有两种方法: 打开“系统设置偏好(System Preferences)” -> “共享(Sharing)” -> “Web共享(Web Sharing)” 打开“终端( ...
- canvas基本用法
1.canvas和其他标签一样使用,但是IE8以下是不支持的,可以在canvas里面加一个span用来提示,例如: <canvas> <span>IE8不支持canvas< ...
- handlebars
Handlebars 是 JavaScript 一个语义模板库,通过对view和data的分离来快速构建Web模板.它采用"Logic-less template"(无逻辑模版)的 ...
- C#签名 NX90
1.在VS中添加D:\Siemens\NX90\ \NXSigningResource.res文件,右击文件属性,将资源变为 嵌入式资源,即生成方式 2.编译生成exe文件或者dll文件,例如:xxx ...
- [VBS]脚本中的字典、动态数组、队列和堆栈
今天用VBS脚本写了几个程序,用到了字典(Dictionary).动态数组(ArrayList).队列(Queue)和堆栈(Stack).现在写篇Blog总结一下 :-) 1.编写环境 今天突发奇想下 ...
- ajax返回类型dataType json和text比较
$.ajax({ type: "post", url: "${ctx}/modules/fos/reference/echart", //dataType:'j ...
- 去除html标签 正则表达式
/// <summary> /// 去除html标签 /// </summary> public static string Clea ...