188金宝搏官网JavaScript实现简单随机点名器_javascript技巧_脚本之家

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

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

1. 效果:

188金宝搏官网 1

2. Html代码:

<body>
<form>
  <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);
    }
    </script>

4. CSS代码:

<style type="text/css">
  body{
    background: #f5faff;
  }
  .ks{
    width: 140px;
    line-height: 55px;
    text-align: center;
    font-weight: bold;
    color: #fff;
    text-shadow:2px 2px 2px #333;
    border-radius: 5px;
    margin:0 20px 20px 0;
    position: relative;
    overflow: hidden;
    background-color: limegreen;
    border:1px solid #d2a000;
    box-shadow: 0 1px 2px #fedd71 inset,0 -1px 0 #a38b39 inset,0 -2px 3px #fedd71 inset;
  }
  #nu{
    background-color: red;
  }
  #div1 { font:40px '微软雅黑';text-align: center; background-color: gainsboro;
    width: 60%;
    height: 60%;
    margin-bottom:20px;
  }
</style>

以上所述是小编给大家介绍的JS实现课堂随机点名和顺序点名,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对帮客之家网站的支持!

1.
效果: 2. Html代码: bodyform div align=”center” input type=”button”
value=”开始点名” onclick=”student…

 随机抽签      开始   暂停   window.onload=function(){ var names = ['name','name','name','name','name']; //&#20154;&#21517;&#25968;&#32452; var clors = ['#EE0000','#CAE1FF','#008B8B','#CDC9C9','#F0F8FF'];//&#39068;&#33394;&#25968;&#32452; var name = document.getElementById; //&#33719;&#21462;id&#20026;name&#30340;&#20803;&#32032; var d = document.getElementById; var temp = document.getElementById; var startR = -1; //&#35760;&#24405;&#35745;&#26102;&#22120;&#30340;&#24207;&#21495; var start = document.getElementById; function Random(){ //&#20135;&#29983;&#38543;&#26426;&#25968;&#65292;&#24182;&#26356;&#25913;h1&#20013;&#30340;&#20869;&#23481;&#19982;&#39068;&#33394; var nNum = Math.floor; //&#36825;&#37324;&#30340;5&#20026;&#20320;&#24403;&#21069;&#20154;&#21517;&#30340;&#25968;&#37327; var cNum = Math.floor; name.innerHTML = names[nNum]; d.style.color = clors[cNum]; } start.onclick = function(){ //&#21333;&#20987;&#24320;&#22987;&#26041;&#27861; if //&#19981;&#21152;&#38480;&#21046;&#65292;&#22810;&#27425;&#28857;&#20987;&#24320;&#22987;&#20250;&#26377;&#22810;&#20010;&#35745;&#26102;&#22120;&#21551;&#21160; startR = setInterval;//&#35774;&#32622;&#35745;&#26102;&#22120;&#65292;&#27599;0.025&#31186;&#25191;&#34892;&#19968;&#27425; } temp.onclick = function(){ //&#21333;&#20987;&#26242;&#20572;&#26041;&#27861; clearInterval; startR = -1; } }

发表评论

电子邮件地址不会被公开。 必填项已用*标注