⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 index.htm

📁 这个抽奖系统从网上找了一下
💻 HTM
字号:
🔍 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 TRANSITIONAL//EN">
<html>
<head>
<title>猜字游戏</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="index.css"/>
<script language="javascript">
<!--
var timer;
var randnum;
var cellnum =1; 
//定义一个存放手机号码的数组
var mobile = new Array();
mobile[0]="教";
mobile[1]="揠";
mobile[2]="苗";
mobile[3]="助";
mobile[4]="次";
mobile[5]="序";
mobile[6]="石";
mobile[7]="孩";
mobile[8]="子";
mobile[9]="识";
mobile[10]="愈";
mobile[11]="很";
mobile[12]="多";
mobile[13]="家";
mobile[14]="或";
mobile[15]="老";
mobile[16]="师";
mobile[17]="都";
mobile[18]="遇";
mobile[19]="到";
mobile[20]="同";
mobile[21]="样";
mobile[22]="的";
mobile[23]="问";
mobile[24]="题";
mobile[25]="应";
mobile[26]="该";
mobile[27]="先";
mobile[28]="甚";
mobile[29]="么";
mobile[30]="那";
mobile[31]="些";
mobile[32]="路";
mobile[33]="笔";
mobile[34]="段";
mobile[35]="脑";
mobile[36]="韩";
mobile[37]="是";
mobile[38]="由";
mobile[39]="印";
mobile[40]="限";
mobile[41]="制";
mobile[42]="辅";
mobile[43]="联";
mobile[44]="赛";
mobile[45]="频";
mobile[46]="道";
mobile[47]="精";
mobile[48]="鼓";
mobile[49]="励";
mobile[50]="硅";
mobile[51]="西";
mobile[52]="神";
mobile[53]="萦";
mobile[54]="津";
mobile[55]="样";
mobile[56]="翻";
mobile[57]="建";
mobile[58]="罗";
mobile[59]="奇";
mobile[60]="怪";
mobile[61]="编";
mobile[62]="兹";


//根据获得的随机数从而显示出随机的手机号码
function getRandNum(){
var num = mobile.length-1;//数组的"最大下标"是"数组长度减一"
document.getElementById("result").value = mobile[GetRnd(0,num)];//调用"GetRnd"随机函数
}

//获得随机数
function GetRnd(min,max){
randnum = parseInt(Math.random()*(max-min+1));//其中"parseInt"是将随机数转换成整数
return randnum;
}

//点击"开始"按钮->需调用的函数
function setTimer(){
timer = setInterval("getRandNum();",10);//过0.01秒就执行一次"getRandNum"函数,随机显示手机号码
document.getElementById("start").disabled = true;//点击开始时->开始按钮变灰色
document.getElementById("stop").disabled = false;//停止按钮可以使用
}
function STOP(){
noDupNum();//调用"noDupNum"函数,移除显示的手机号码
clearInterval(timer);//取消赋值给"timer"间隔要执行的函数
document.getElementById("start").disabled = false;//开始按钮可以使用
document.getElementById("stop").disabled = true;//点击停止时->停止按钮变灰
}

//点击"停止"按钮->需调用的函数
function clearTimer(){
noDupNum();//调用"noDupNum"函数,移除显示的手机号码
clearInterval(timer);//取消赋值给"timer"间隔要执行的函数
document.getElementById("start").disabled = false;//开始按钮可以使用
document.getElementById("stop").disabled = true;//点击停止时->停止按钮变灰色
}

//移除那些出现过的手机号码
function noDupNum(){
mobile.removeEleAt(randnum);//点击"停止"按钮出现的号码给移除
var o = 0;
for(p=0; p<mobile.length;p++){
if(typeof mobile[p]!="undefined"){//其中"typeof"是返回"mobile[p]"的类型,有"number","string","boolean" "object","function"和"undefined"这6种返回类型,用字符串来显示
mobile[o] = mobile[p];
o++;
}
}
num = mobile.length-1;//移除一个号码时,其"数组长度减一"重新赋值给"数组下标"
}
Array.prototype.removeEleAt = function(dx){
if(isNaN(dx)||dx>this.length){
return false;
}
this.splice(dx,1);//其中"splice"是从dx开始一个一个移除
}

//将随机产生的手机号码显示到中奖区域
function setValues(){
document.getElementById(cellnum).value = document.getElementById("result").value ;
cellnum++;//从1开始递增到50的文本框ID,这里是从"三等奖"开始显示
}
function img1(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv1").style.display="";
	}
	else{
		STOP();
		document.getElementById("apDiv1").style.display="none";
	}
}
function img2(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv2").style.display="";
	}
	else{
		STOP();
		document.getElementById("apDiv2").style.display="none";
	}
}
function img3(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv3").style.display="";
	}
	else{
	STOP();
		document.getElementById("apDiv3").style.display="none";
	}
}
function img4(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv4").style.display="";
	}
	else{
		STOP();
		document.getElementById("apDiv4").style.display="none";
	}
}
function img5(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv5").style.display="";
	}
	else{
		STOP();
		document.getElementById("apDiv5").style.display="none";
	}
}
function img6(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv6").style.display="";
	}
	else{
		STOP();
		document.getElementById("apDiv6").style.display="none";
	}
}
function img7(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv7").style.display="";
	}
	else{
		STOP();
		document.getElementById("apDiv7").style.display="none";
	}
}
function img8(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv8").style.display="";
	}
	else{
		STOP();
		document.getElementById("apDiv8").style.display="none";
	}
}
function img9(){
	if(document.getElementById("result").value=="")
	{
		alert("请先抽取汉字!!!");
		document.getElementById("apDiv9").style.display="";
	}
	else{
		STOP();
		document.getElementById("apDiv9").style.display="none";
	}
}
function imgesShow(){
	document.getElementById("apDiv1").style.display="";
	document.getElementById("apDiv2").style.display="";
	document.getElementById("apDiv3").style.display="";
	document.getElementById("apDiv4").style.display="";
	document.getElementById("apDiv5").style.display="";
	document.getElementById("apDiv6").style.display="";
	document.getElementById("apDiv7").style.display="";
	document.getElementById("apDiv8").style.display="";
	document.getElementById("apDiv9").style.display="";
	document.getElementById("show").value="";
}
function show(){
	document.getElementById("show").value=document.getElementById("result").value
}
-->
</script>
<style type="text/css">
<!--
#apDiv1 {
	position:absolute;
	left:262px;
	top:104px;
	width:160px;
	height:160px;
	z-index:1;
	background-color:#f28542;
}
#apDiv2 {
	position:absolute;
	left:422px;
	top:104px;
	width:163px;
	height:160px;
	z-index:2;
	background-color:#f28542;
}
#apDiv3 {
	position:absolute;
	left:584px;
	top:104px;
	width:163px;
	height:163px;
	z-index:3;
	background-color:#f28542;
}
#apDiv4 {
	position:absolute;
	left:262px;
	top:264px;
	width:163px;
	height:163px;
	z-index:4;
	background-color:#f28542;
}
#apDiv5 {
	position:absolute;
	left:262px;
	top:423px;
	width:163px;
	height:163px;
	z-index:5;
	background-color:#f28542;
}
#apDiv6 {
	position:absolute;
	left:423px;
	top:264px;
	width:163px;
	height:163px;
	z-index:6;
	background-color:#f28542;
}
#apDiv7 {
	position:absolute;
	left:584px;
	top:265px;
	width:163px;
	height:163px;
	z-index:7;
	background-color:#f28542;
}
#apDiv8 {
	position:absolute;
	left:424px;
	top:423px;
	width:163px;
	height:163px;
	z-index:8;
	background-color:#f28542;
}
#apDiv9 {
	position:absolute;
	left:587px;
	top:426px;
	width:160px;
	height:160px;
	z-index:9;
	background-color:#f28542;
}
#apDiv10 {
	position:absolute;
	left:58px;
	top:30px;
	width:159px;
	height:48px;
	z-index:10;
}
-->
</style>
</head>
<body STYLE="background-color:transparent">
<div id="apDiv1" style="border:none;">
  <div align="center"><a href="#" onClick="img1();"><br>
  <img src="images/0.gif" align="middle" style="border:none;"/></a></div>
</div>
<div id="apDiv2" style="border:none;">
  <div align="center"><a href="#" onClick="img2();"><br>
  <img src="images/0.gif" style="border:none;"/></a></div>
</div>
<div id="apDiv3" style="border:none;">
  <div align="center"><a href="#" onClick="img3();"><br>
  <img src="images/0.gif" style="border:none;"/></a></div>
</div>
<div id="apDiv4" style="border:none;">
  <div align="center"><a href="#" onClick="img4();"><br>
  <img src="images/0.gif" style="border:none;"/></a></div>
</div>
<div id="apDiv5" style="border:none;">
  <div align="center"><a href="#" onClick="img5();"><br>
  <img src="images/0.gif" style="border:none;"/></a></div>
</div>
<div id="apDiv6" style="border:none;">
  <div align="center"><a href="#" onClick="img6();"><br>
  <img src="images/0.gif" style="border:none;"/></a></div>
</div>
<div id="apDiv7" style="border:none;">
  <div align="center"><a href="#" onClick="img7();"><br>
  <img src="images/0.gif" style="border:none;"/></a></div>
</div>
<div id="apDiv8" style="border:none;">
  <div align="center"><a href="#" onClick="img8();"><br>
  <img src="images/0.gif" style="border:none;"/></a></div>
</div>
<div id="apDiv9" style="border:none;">
  <div align="center"><a href="#" onClick="img9();"><br>
  <img src="images/0.gif" style="border:none;"/></a></div>
</div>
<div id="apDiv10">
  <div align="center">优卖网提供<br>
    www.it2500.com</div>
</div>
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="89" colspan="4">&nbsp;</td>
  </tr>
  <tr>
    <td colspan="4"><div align="center">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td><div align="center">
            <input type="text" id="result" 

style="height:480px;width:480px;text-align:center;border:2px solid red;font-size:480px;font-family:黑体;"

readonly/>
          </div></td>
        </tr>
      </table>
    </div>
    <div align="center"></div></td>
  </tr>
  
  <tr>
    <td width="43%" height="49">
      
      <div align="right">
        <input id="start" type="button" value="抽取汉字" style="border: 1px solid; border-

color: #aaa 000 #000 #aaa;width:80px;height:30px; background: #eea407;font-size:20px;font-family:黑体"; onClick="setTimer();imgesShow()" />
      </div></td>
    <td width="3%">&nbsp;</td>
    <td width="12%" height="49"><input id="stop" type="button" value=" 停  止 " style="border: 1px solid; border-

color: #aaa 000 #000 #aaa;width:80px;height:30px; background: #eea407;font-size:20px;font-family:黑体;"onClick="clearTimer();setValues();" disabled/></td>
    <td width="42%"><input id="stop2" type="button" value="显示答案" onclick="show()" style="border: 1px solid; border-

color: #aaa 000 #000 #aaa;width:80px;height:30px; background: #eea407;font-size:20px;font-family:黑体;"onClick="" /></td>
  </tr>
  <tr>
    <td height="49" colspan="4"><div align="center">
      <input name="show" type="show" id="21" style="height:60px;width:170px;text-align:center;border:1px solid red;font-size:50;font-family:黑体"/>
    </div></td>
  </tr>
  <tr>
    <td colspan="4"><div align="center"></div></td>
  </tr>
</table>
</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -