JS抽奖程序
在经典论坛看到一个抽奖程序的求助，趁着自己有空，也写一个。有点懒，用了人家的html和css。
想象在一个活动中，给每个进场的人员按顺序发标有001、002……这样的卡片，这样就可以知道参与抽奖的人员有多少。抽奖可能分一等奖、二等奖等，这里我就不管，只是每个抽中的号码，不会出现在下次的抽奖中，就是每个人最多只能获一次奖。
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>抽奖程序</title> 6 <style type="text/css"> 7 <!-- 8 body {margin:0px;padding:0px;background-color: #000;text-align:center;} 9 #oknum{color:#f33;font-size:168px;line-height:168px;width:678px;height:168px;margin-left:auto;margin-right:auto;margin-top:68px;text-align:center;background:#121212; font-family:Arial, Helvetica, sans-serif;} 10 #finish{color:red;width:648px;height:168px;margin-left:auto;margin-right:auto;margin-top:1px;text-align:left;background:#121212; font-size:36px; padding:15px; font-family:Arial, Helvetica, sans-serif; word-spacing:15px;} 11 #start{width:680px;height:168px;margin-left:auto;margin-right:auto;margin-top:1px;text-align:center; font-family:微软雅黑; } 12 #start a{color:#868686;font-size:86px;line-height:168px;width:338px;height:168px;background:#121212;float:left;margin:1px;text-decoration: none;} 13 #start a:hover{color:#868686;background-color: #2E2E2E;} 14 --> 15 </style> 16 </head> 17 <body> 18 <div id="oknum"></div> 19 <div id="start"><a href="#Action">开始</a><a href="#Stop">停止</a></div><div style="clear:both;"></div> 20 <div id="finish"></div> 21 <script type="text/javascript"> 22 var totalNum = 200; //参与抽奖总人数 23 var a = []; 24 var i; 25 26 //初始化数组 27 for(i=1; i<=totalNum; i++) { 28 if(i < 10) { 29 a.push("00"+i); 30 } 31 else if(i < 100 && i>=10) { 32 a.push("0"+i); 33 } 34 else if(i>=100 && i<1000) { 35 a.push(i); 36 } 37 } 38 39 function startDraw() { 40 var n = 0; 41 flow(); 42 function flow() { 43 if(n===a.length) { n = 0; } 44 document.getElementById("oknum").innerHTML = a[n]; 45 n++; 46 handle = setTimeout(flow,10); 47 } 48 } 49 function stopDraw() { 50 clearTimeout(handle); 51 var oknum = document.getElementById("oknum").innerHTML; 52 document.getElementById("finish").innerHTML += oknum + " "; 53 for(i=0; i<a.length; i++) { 54 if(a[i] === oknum) { 55 a.splice(i,1); 56 } 57 } 58 } 59 document.getElementById("start").getElementsByTagName("a")[0].onclick = startDraw; 60 document.getElementById("start").getElementsByTagName("a")[1].onclick = stopDraw; 61 </script> 62 </body> 63 </html>
