当前位置:首页 > javascript技术文章 > js实现随机点名小功能

js随机点名小功能代码实例

  • 发布时间:
  • 作者:码农之家原创
  • 点击:158

这篇文章主要知识点是关于js、随机点名、的内容,如果大家想对相关知识点有系统深入的学习,可以参阅以下电子书

精通JavaScript
精通JavaScript高清第2版
  • 类型:JavaScript大小:33.5 MB格式:PDF作者:陈贤安
立即下载

js实现随机点名小功能

本文实例为大家分享了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> 


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持码农之家。

以上就是本次给大家分享的关于java的全部知识点内容总结,大家还可以在下方相关文章里找到相关文章进一步学习,感谢大家的阅读和支持。

推荐内容

IntelliJ IDEA 注册码(激活到2089年)

idea2020注册激活码(激活到2100年)

实例分析Java实现的zip压缩及解压缩工具类

python3 pandas 如何读取MySQL数据和插入

ThinkPHP3.2.3框架如何实现分页功能

展开 +

收起 -

javascript 相关电子书
学习笔记
网友NO.120962

JS实现课堂随机点名和顺序点名

1. 效果: 2. Html代码: bodyform div align="center" input type="button" value="开始点名" onclick="students()" class="ks"/ input type="button" value="停止点名" onclick="stop()" class="ks" id="nu"/ hr color="blue" br div id="div1" align="center"随机点名区域/div /div/form/body 3. JavaScript代码: script type="text/javascript" var i = 0; //t用来接收setTimeOut()的返回值 var t; var st = ['张三','李四', '老王','旺财','铁柱', '王八','来福','小明','小红','狗蛋','SB.Child']; var u; //点名函数 function students() { //顺序点名 /* if (i st.length) { u = st[i]; } else { //点到最后一个就回来重新点起 i = 0; u = st[i]; } i = i + 1;*/ //随机点名 产生0-数组长度之间的数作为数组下标 var num = Math.floor(Math.random()*st.length); u = st[num]; //更改文本框显示的value值 document.getElementById("div1").innerHTML = u ; t = setTimeout("students()", 1000); } //停止点名函数 function stop() { clearTimeout(t); ……

网友NO.779546

js实现随机点名系统(实例讲解)

废话不多说,直接上代码: !DOCTYPE htmlhtml lang="en"headmeta charset="UTF-8"title随机点名/titlestyle type="text/css"td{text-align: center;}/style/headbodytable width="760" border="1" height="460" align="center"h1 align="center"随机点名系统/h1trtd/tdtd/tdtd/tdtd/tdtd/tdtd/td/trtrtd/tdtd/tdtd/tdtd/tdtd/tdtd/td/trtrtd/tdtd/tdtd/tdtd/tdtd/tdtd/td/trtrtd/tdtd/tdtd/tdtd/tdtd/tdtd/td/trtrtd/tdtd/tdtd/tdtd/tdtd/tdtd/td/tr/tablediv align="center"br/br/input type="button" value="随机抽取" onclick="selectRandom();"/input type="button" value="打乱顺序" onclick="Upsetorder();"/br/br/input type="button" value="快速抽取" onclick="Quickextr();"/input type="button" value="停止抽取" onclick="Stopextr();"//divscript type="text/javascript"var classMate = ["周远康","刘婷婷","戴娜","范凯","向彬","胡波","胡辉","黄缘平","刘云","刘嘉鑫","赵福全","王小妹","苏伟","李辉","曾伟","李佳晓","钟仕文","张志强","袁鑫豪","余日成","付立……

网友NO.655889

原生JS实现随机点名项目的实例代码

核心思想 •随机产生规定范围内的整数,然后再产生相同范围内的整数,两者相同时,则暂停。 所用知识 •Math.random() * num: 产生从0到num的随机数 •Math.floor(): 向下取整 •简单的DOM操作等 技术扩展 •扩展人数 •添加停止键等 效果 代码如下 •html: div class="container" section class="demo" ul li/li li/li li/li /ul /section section class="students"ul/ul/section section class="buttonList" ul libutton type="button"随机选一个/button/li libutton type="button"随机选两个/button/li libutton type="button"随机选三个/button/li /ul /section /div •css: style type="text/css" * { margin: 0; padding: 0; } ul { list-style: none; } body { width: 100%; height: 100%; background: url("images/bg.jpg") no-repeat; background-size: cover; } button { border: none; background-color: transparent; color: #fff; font-size: 20px; } .container { width: 1200px; height: 700px; margin: 10px auto; } .container .demo, .contain……

<
1
>

电子书 编程教程 文档 软件 源码 视频

Copyright 2018-2020 xz577.com 码农之家

本站所有电子书资源不再提供下载地址,只分享来路

免责声明:网站所有作品均由会员网上搜集共同更新,仅供读者预览及学习交流使用,下载后请24小时内删除

版权投诉 / 书籍推广 / 赞助:QQ:520161757