作者:jegg
年底将至,许多公司忙着搞年会,会上一般都会有一些抽奖活动,下面的程序就是用JAVASCRIPT 写的一个简单的抽奖系统与大家共享。
此代码借鉴了网上的一些网友的代码,又加上了一些诸如不重复抽奖之类的改进。大概思路如下:
1.将所有的的抽奖数据(这里为手机号码)存入数组中。 2.使用random
函数随机产生该数组的INDEX 3.使用setInterval
函数以极短的时间间隔产生该数组随机INDEX所对应的手机号码,并显示。 4.使用removeEleAt(index)函数删除随机产生过的手机号码。并且重新组织生成剩余的手机号码为一个新的数组,为下次使用。
使用方法:
将以下原代码拷到写字板上,然后将txt属性该成html即可。如果出现显示乱码,请改变网页编码(查看--编码)。
原代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
TRANSITIONAL//EN"> <html> <head> <title>
2006年会抽奖系统</title> <meta http-equiv="Content-Type"
content="text/html; charset=utf-8"> <script
language="javascript"> // global variables var timer; var
flag = new Array(100); var existingnum = new Array(100); var clickTimes =
0; var randnum; var cellnum =1; var mobile = new Array(); // set
data
here!! mobile[0]=13020000100; mobile[1]=13020000101; mobile[2]=13020000102; mobile[3]=13020000103; mobile[4]=13020000104; mobile[5]=13020000105; mobile[6]=13020000106; mobile[7]=13020000107; mobile[8]=13020000108; mobile[9]=13020000109; mobile[10]=13020000110; mobile[11]=13020000111; mobile[12]=13020000112; mobile[13]=13020000113; mobile[14]=13020000114; mobile[15]=13020000115;
mobile[16]=13020000116; mobile[17]=13020000117; mobile[18]=13020000118; mobile[19]=13020000119; mobile[20]=13020000120; mobile[21]=13020000121; mobile[22]=13020000122; mobile[23]=13020000123; mobile[24]=13020000124; mobile[25]=13020000125; mobile[26]=13020000126; mobile[27]=13020000127; mobile[28]=13020000128; mobile[29]=13020000129; mobile[30]=13020000130; mobile[31]=13020000131; mobile[32]=13020000132; mobile[33]=13020000133; mobile[34]=13020000134; mobile[35]=13020000135; mobile[36]=13020000136; mobile[37]=13020000137; mobile[38]=13020000138; mobile[39]=13020000139; mobile[40]=13020000140; mobile[41]=13020000141; mobile[42]=13020000142; mobile[43]=13020000143; mobile[44]=13020000144; mobile[45]=13020000145; mobile[46]=13020020146; var
num = mobile.length-1; function
getRandNum(){ document.getElementById("result").value =
mobile[GetRnd(0,num)]; } function
start(){ clearInterval(timer); timer = setInterval('change()',50);
} function ok(){ clearInterval(timer); } function
GetRnd(min,max){ randnum =
parseInt(Math.random()*(max-min+1)); return randnum; } function
setTimer(){ timer =
setInterval("getRandNum();",10); document.getElementById("start").disabled
= true; document.getElementById("end").disabled =
false; } function
clearTimer(){ noDupNum(); clearInterval(timer); document.getElementById("start").disabled
= false; document.getElementById("end").disabled =
true; }
function noDupNum(){ // to remove the selected mobile phone
number mobile.removeEleAt(randnum); // to reorganize
the mobile number array!! var o = 0; for(p=0;
p<mobile.length;p++){ if(typeof
mobile[p]!="undefined"){ mobile[o] =
mobile[p]; o++; } } num =
mobile.length-1; } // method to remove the element in the
array Array.prototype.removeEleAt =
function(dx) { if(isNaN(dx)||dx>this.length){return
false;} this.splice(dx,1); } // set mobile phone numbers to
the table cell function
setValues(){ document.getElementById(cellnum).value =
document.getElementById("result").value
; cellnum++; } </script> </head> <body> <center> <div>
</div> <div
id="main"> <div> <h1>
中奖号码</h1> <p> <input
id="result" type="text" size="30" style="height:130px;width:800px;border:2px
solid red;font-size:120;"
readonly/></p> <p> <input id="start"
type="button" value="开始" style="border: 1px solid; border-color: #aaa 000 #000
#aaa;width:4em; background: #fc0;" onclick="setTimer()" /> <input
id="end" type="button" value="停" style="border: 1px solid; border-color: #aaa
000 #000 #aaa;width:4em; background: #fc0;"onclick="clearTimer();setValues();"
disabled/> </p> <p><strong>一等奖(10名)</strong></p> <table
width="946" height="79"
border="1"> <tr> <td><input name="text36"
type="text" id="36" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="28"
readonly/></td> <td><input name="text37" type="text"
id="37" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text38"
type="text" id="38" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> <td><input name="text39" type="text"
id="39" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text40"
type="text" id="40" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> </tr> <tr> <td><input
name="text41" type="text" id="41" style="height:30px;width:190px;border:1px
solid red;font-size:25;" size="28"
readonly/></td> <td><input name="text42" type="text"
id="42" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text43"
type="text" id="43" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> <td><input name="text44" type="text"
id="44" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text45"
type="text" id="45" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> </tr> </table> <p>二等奖(15名)</p> <table
width="951" height="88" border="1"> <tr>
<td><input name="text21" type="text" id="21"
style="height:30px;width:190px;border:1px solid red;font-size:25;" size="28"
readonly/></td> <td><input name="text22" type="text"
id="22" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text23"
type="text" id="23" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> <td><input name="text24" type="text"
id="24" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text25"
type="text" id="25" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> </tr> <tr> <td><input
name="text26" type="text" id="26" style="height:30px;width:190px;border:1px
solid red;font-size:25;" size="28"
readonly/></td> <td><input name="text27" type="text"
id="27" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text28"
type="text" id="28" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> <td><input name="text29" type="text"
id="29" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text30"
type="text" id="30" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> </tr> <tr> <td><input
name="text31" type="text" id="31" style="height:30px;width:190px;border:1px
solid red;font-size:25;" size="28"
readonly/></td> <td><input name="text32" type="text"
id="32" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text33"
type="text" id="33" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> <td><input name="text34" type="text"
id="34" style="height:30px;width:190px;border:1px solid red;font-size:25;"
size="20" readonly/></td> <td><input name="text35"
type="text" id="35" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="20"
readonly/></td> </tr> </table> <p>三等奖(20名)</p> <table
width="961" height="102"
border="1"> <tr> <td><input name="text1"
type="text" id="1" style="height:30px;width:190px;border:1px solid
red;font-size:25;" size="28"
readonly/></td> <td><input name="text2" type="text"
id="2" style="height:30px;width:190px;bord
[1] [2] 下一页 [操作系统]死马还当活马医:6种方法挽救Windows系统 [操作系统]操作系统的分类 [网络安全]如何让您的系统更加安全之十条建议 [网络安全]系统安全之分析网络入侵检测系统安全 [网络安全]Windows操作系统系列之安全防范之预防病毒的八个忠… [Web开发]net在线考试系统如何控制考试时间 [Web开发]Vista系统IIS7设置全攻略 [Web开发]asp.net网上考试系统功能介绍 [操作系统]WindowsVista操作系统实用技巧八则 [操作系统]Windows XP系统中的十个特殊文件
|