- <!DOCTYPE head PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <title>点名系统</title>
- </head>
- <body>
- <h1>随机抽选列表:</h1>
- <div id="nameList"></div>
- <div id="btn">
- <button id="bStart">开始</button>
- <button id="bEnd">停止</button>
- </div>
- <div id="ok"></div>
- <script>
- // 设置滚动速度,即每过多少时间打乱一次排序
- var speed = 20;
- // 设置姓名列表
- var array = [ "李国", "王五", "赵六", "李三", "小明" ];
- window.onload = function() {
-
- var list = document.getElementById('nameList');
- var timer = null;
- var newarr = [];
-
- //对数据进行随机排序,即打乱数据的排序
- function randomsort(a, b) {
- return Math.random() > .5 ? -1 : 1;
- }
- function randlist() {
- var string = '';
- //打乱数组顺序
- var newarray = array.sort(randomsort);
- //文档区域显示排序
- for ( var i = 0; i < newarray.length; i++) {
- string += '<p>' + array + '</p>';
- }
- list.innerHTML = string;
-
- return newarray;
- }
- //初始化
- randlist();
- var start = 0;
- document.getElementById('bStart').onclick = function() {
- if (start == 1) {
- return false;
- }
- start = 1;
- timer = setInterval(function() {
- newarr = randlist();
- }, speed);
- document.getElementById('ok').innerHTML = '正在抽取,请稍后...';
- };
-
- document.getElementById('bEnd').onclick = function() {
- //开始排序之前,newarr为空,即长度为0,0表示false
- if (!newarr.length) {
- document.getElementById('ok').innerHTML = '请先点击“开始”';
- return false;
- }
- start = 0;
-
- //clearTimeout() Cancels a time-out that was set with the setTimeout method.
- clearTimeout(timer);
-
- //生成随机数
- var num = parseInt(array.length * Math.random());
-
-
- ////////////////////////////////////////////////////////////////
- //判断当前元素是否为不想显示的名字,如果是,判断该元素在newarr中脚标是否为0,不为零就将前一位打印出来,为零就打印后一位
- var notMe ="小明";
- if(newarr[num] == notMe) {
- num == 0 ? num++ : num--;
- }
- ////////////////////////////////////////////////////////////////
-
- document.getElementById('ok').innerHTML = '“' + newarr[num]
- + '”同学';
- newarr = [];
- };
- }
- </script>
- </body>
- </html>
复制代码 额,就是这样了
|