js实现随机点名小功能


Posted in Javascript onAugust 17, 2017

本文实例为大家分享了js实现随机点名功能的具体代码,供大家参考,具体内容如下

<!DOCTYPE html> 
<html> 
 <head> 
  <meta charset="UTF-8"> 
  <title></title> 
 </head> 
 <body> 
  <div id="name1"></div> 
  <button id="btn">stop</button> 
   
 </body> 
 <script type="text/javascript"> 
  var flag = true; 
  var str = "张三,李四,王五,马六"; 
  var arr = str.split(","); 
  var interId = setInterval("randName()",100); 
  function randName(){ 
   var rand = Math.floor(Math.random() * arr.length); 
   name1.innerHTML = arr[rand]; 
  }  
  btn.onclick = function (){ 
   if (flag) { 
    btn.innerHTML = "start"; 
    clearInterval(interId); 
    flag = false; 
   } else{ 
     
 
btn.innerHTML = "stop"; 
    interId = setInterval("randName()",100); 
    flag = true; 
   } 
  } 
 </script> 
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 事件系统
Jul 22 Javascript
基于Jquery的简单图片切换效果
Jan 06 Javascript
jQuery中unbind()方法用法实例
Jan 19 Javascript
jQuery选择器源码解读(七):elementMatcher函数
Mar 31 Javascript
jquery编写Tab选项卡滚动导航切换特效
Jul 17 Javascript
JS取数字小数点后两位或n位的简单方法
Oct 24 Javascript
ajax级联菜单实现方法实例分析
Nov 28 Javascript
vue上传图片组件编写代码
Jul 26 Javascript
Bootstrap3.3.7导航栏下拉菜单鼠标滑过展开效果
Oct 31 Javascript
jQuery实现ajax回调函数带入参数的方法示例
Jun 26 jQuery
vue-router 起步步骤详解
Mar 26 Javascript
基于Vue插入视频的2种方法小结
Apr 02 Javascript
浅谈Vuejs Prop基本用法
Aug 17 #Javascript
简单快速的实现js计算器功能
Aug 17 #Javascript
使用jquery的jsonp如何发起跨域请求及其原理详解
Aug 17 #jQuery
如何理解Vue的.sync修饰符的使用
Aug 17 #Javascript
浅谈JS中的反柯里化( uncurrying)
Aug 17 #Javascript
js编写简单的聊天室功能
Aug 17 #Javascript
Angular使用 ng-img-max 调整浏览器中的图片的示例代码
Aug 17 #Javascript
You might like
Protoss建筑一览
2020/03/14 星际争霸
php session 检测和注销
2009/03/16 PHP
分享8个最佳的代码片段在线测试网站
2013/06/29 PHP
jquery插件制作 手风琴Panel效果实现
2012/08/17 Javascript
利用jQuery的deferred对象实现异步按顺序加载JS文件
2013/03/17 Javascript
js创建一个input数组并绑定click事件的方法
2014/06/12 Javascript
js单独获取一个checkbox看其是否被选中
2014/09/22 Javascript
基于JavaScript创建动态Dom
2015/12/08 Javascript
一个用jquery写的判断div滚动条到底部的方法【推荐】
2016/04/29 Javascript
js实现消息滚动效果
2017/01/18 Javascript
Angular4 中内置指令的基本用法
2017/07/31 Javascript
Nodejs进阶之服务端字符编解码和乱码处理
2017/09/04 NodeJs
react-native使用react-navigation进行页面跳转导航的示例
2017/09/07 Javascript
利用Blob进行文件上传的完整步骤
2018/08/02 Javascript
Vue代码整洁之去重方法整理
2019/08/06 Javascript
微信小程序表单验证插件WxValidate的二次封装功能(终极版)
2019/09/03 Javascript
关于vue路由缓存清除在main.js中的设置
2019/11/06 Javascript
js实现石头剪刀布游戏
2020/10/11 Javascript
pytorch 转换矩阵的维数位置方法
2018/12/08 Python
pytorch实现Tensor变量之间的转换
2020/02/17 Python
利用python实现逐步回归
2020/02/24 Python
Python字符串格式化常用手段及注意事项
2020/06/17 Python
Boden美国官网:英伦原创时装品牌
2017/07/03 全球购物
帕克纽约:PARKER NY
2018/12/09 全球购物
如何实现一个自定义类的序列化
2012/05/22 面试题
购房意向书
2014/04/01 职场文书
幼儿园小班教师寄语
2014/04/03 职场文书
出国留学计划书
2014/04/27 职场文书
职位说明书范文
2014/05/07 职场文书
党员公开承诺书内容
2014/05/20 职场文书
争先创优演讲稿
2014/09/15 职场文书
一份关于丢失公司财物的检讨书
2014/09/19 职场文书
2014年国庆节演讲稿精选范文1500字
2014/09/25 职场文书
灵山大佛导游词
2015/02/04 职场文书
《水浒传》读后感3篇(范文)
2019/09/19 职场文书
关于MySQL中explain工具的使用
2023/05/08 MySQL