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 相关文章推荐
jQuery Selector选择器小结
May 06 Javascript
js 分页全选或反选标识实现代码
Aug 09 Javascript
js闭包实现按秒计数
Apr 23 Javascript
全面解析Bootstrap表单使用方法(表单控件状态)
Nov 24 Javascript
基于javascript实现页面加载loading效果
Sep 15 Javascript
js实现用户输入的小写字母自动转大写字母的方法
Jan 21 Javascript
基于express中路由规则及获取请求参数的方法
Mar 12 Javascript
JavaScript检查数据中是否存在相同的元素(两种方法)
Oct 07 Javascript
通过JS深度判断两个对象字段相同
Jun 14 Javascript
JavaScript数组排序小程序实现解析
Jan 13 Javascript
Vue-cli打包后如何本地查看的操作
Sep 02 Javascript
5种方法告诉你如何使JavaScript 代码库更干净
Sep 15 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
PHP 读取和修改大文件的某行内容的代码
2009/10/30 PHP
php+Memcached实现简单留言板功能示例
2017/02/15 PHP
thinkPHP5.0框架环境变量配置方法
2017/03/17 PHP
phpfpm的作用和用法
2019/10/10 PHP
jquery ajax方式直接提交整个表单核心代码
2013/08/15 Javascript
jQuery+PHP打造滑动开关效果
2014/12/16 Javascript
JQUERY简单按钮轮换选中效果实现方法
2015/05/07 Javascript
使用jQuery制作浮动工具栏的实例分享
2016/05/13 Javascript
js中使用使用原型(prototype)定义方法的好处详解
2016/07/04 Javascript
jQuery ajaxForm()的应用
2016/10/14 Javascript
Bootstrap CSS组件之按钮下拉菜单
2016/12/17 Javascript
Bootstrap模态框(Modal)实现过渡效果
2017/03/17 Javascript
详解如何使用node.js的开发框架express创建一个web应用
2018/12/20 Javascript
微信实现自动跳转到用其他浏览器打开指定APP下载
2019/02/15 Javascript
mapboxgl区划标签避让不遮盖实现的代码详解
2020/07/01 Javascript
[59:15]EG vs LGD 2018国际邀请赛淘汰赛BO3 第一场 8.26
2018/08/29 DOTA
python实现感知机线性分类模型示例代码
2019/06/02 Python
Pycharm连接远程服务器并实现远程调试的实现
2019/08/02 Python
python 利用turtle模块画出没有角的方格
2019/11/23 Python
基于torch.where和布尔索引的速度比较
2020/01/02 Python
python 的topk算法实例
2020/04/02 Python
CSS3 滤镜 webkit-filter详细介绍及使用方法
2012/12/27 HTML / CSS
详解CSS3中border-image的使用
2015/07/18 HTML / CSS
CSS3制作圆角图片和椭圆形图片
2016/07/08 HTML / CSS
澳大利亚第一的设计师礼服租赁网站:GlamCorner
2017/08/13 全球购物
世界汽车零件:World Car Parts
2019/09/04 全球购物
毕业生医学检验求职信
2013/10/16 职场文书
办公室文员岗位职责范本
2014/06/12 职场文书
科学发展观演讲稿
2014/09/11 职场文书
平遥古城导游词
2015/02/03 职场文书
个人自荐书范文
2015/03/09 职场文书
2015年社区民政工作总结
2015/04/21 职场文书
在校生证明
2015/06/17 职场文书
如何用PHP websocket实现网页实时聊天
2021/05/26 PHP
Python中生成随机数据安全性、多功能性、用途和速度方面进行比较
2022/04/14 Python
Nginx静态压缩和代码压缩提高访问速度详解
2022/05/30 Servers