学自潭州学院视频
主程序页面截图
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 7 <title>抽签系统</title> 8 9 <style type="text/css"> 10 .activity { 11 width: 600px; 12 height: 300px; 13 border: 1px solid; 14 margin: 150px auto; 15 } 16 17 .text { 18 width: 600px; 19 height: 100px; 20 background: #379be9; 21 text-align: center; 22 line-height: 100px; 23 font-size: 28px; 24 color: white; 25 } 26 27 body { 28 font-size: 12px; 29 font-family: "微软雅黑"; 30 color: #666; 31 } 32 33 .myform { 34 text-align: center; 35 margin: 10px; 36 } 37 38 .a_value { 39 width: 200px; 40 height: 40px; 41 line-height: 40px; 42 font-size: 24px; 43 text-align: center; 44 margin-top: 40px; 45 margin-bottom: 30px 46 } 47 48 .btn { 49 width: 100px; 50 height: 30px; 51 } 52 </style> 53 </head> 54 <body> 55 <!-- div层，盒子，容器 --> 56 <div class="activity"> 57 <div class="text" id="myText">抽签系统</div> 58 <div class="myform"> 59 <input type="text" class="a_value" id="myRandom"></br> 60 <input type="button" value="开始" class="btn" onclick="myStart()"> 61 <input type="button" value="停止" class="btn" onclick="myStop()"> 62 </div> 63 </div> 64 <!-- 动态脚本 --> 65 <script type="text/javascript"> 66 //开始抽奖的方法 67 var timer = null;//定时器的变量 68 var data = "宿兵畅,尹博文,王悦雪,杜舟,康泽生,武凡,高梦轩,佘士耀,魏昭宇";//抽奖数据，以逗号分隔 69 //分拆抽奖的数据为数组 70 var arr = data.split(","); 71 function myStart() { 72 //开始之前清空文本框 73 document.getElementById("myRandom").value = ""; 74 if (!timer) { 75 //创建定时器 76 timer = setInterval(function change(){ 77 var max = arr.length - 1;//数组的长度 78 var rand = Math.random();//创建一个随机数，大于0 79 var randIndex = parseInt(rand * max);//得到整型数据 80 var text_val = document.getElementById("myText");//获取文本框区域的值 81 text_val.innerHTML = arr[randIndex];//文本框的值显示在页面 82 },50);//每50毫秒的间隔，更快的是数字变小 83 } 84 85 } 86 87 function myStop(){ 88 clearInterval(timer);//清除定时器 89 timer = null;//变量定时器的清空 90 var myText = document.getElementById("myText");//获取变化区域的值 91 var myRandom = document.getElementById("myRandom");//获取文本框里面的值 92 myRandom.value = myText.innerHTML;//给文本框赋新值 93 } 94 </script> 95 </body> 96 </html>