timer=setInterval(function(){
var i=Math.floor(Math.random()*sz.length);
guen[0].innerHTML=sz[i];
},100);
存放定时器的变量是先定义 var timer,后面才能存放定时器来使用的,
文中代码“
clearInterval(timer);
timer=setInterval(function(){
“这里是先清除一个timer(这是变量既没有定义,也没有用做存放定时器,系统就不认识了),后用做存放定时器,
逻辑上解决办法肯定是先用做存放定时器吗,后才能清除,改变两者先后顺序,
但从本抽奖程序而言,又确确实实这里要先清除,再使用(这主要是针对重复点击”开始抽奖“按钮的情况)解决办法就是一个:在js程序window.onload=function(){}的前面定义全局变量并赋初值var timer=null;这样全局都认识这个timer了
// JavaScript Document
var timer=null; /*全局变量*/
window.onload=function(){
var list=["三星手机","玩具娃娃","手机充值卡","带薪休假","超市购物卡","餐券","苹果ipad","运动手环"];
var b1=document.getElementById("b1");
var b2=document.getElementById("b2");
var prize=document.getElementById("prize");
b1.onclick=play;
……
我知道哪里错了,给你说说, clearInterval(timer);这时候的这个timer是还没有定义的,所以运行到这里的时候就错了,你自己琢磨着改吧
这是全部代码
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>抽奖系统</title>
<style type="text/css">
#cj{width:200px;margin:0 auto;text-align:center;}
span{color:red;font-size:30px;}
input{margin:20px 0;}
</style>
<script type="text/javascript">
window.onload=function(){
var ks=document.getElementById("ks");
var js=document.getElementById("js");
var guen=document.getElementsByTagName("span");
var c=0;
//点击按钮抽奖
ks.onclick=kaishi;
js.onclick=jieshu;
//按enter键抽奖
document.onkeyup=function(event){
event=event||window.event;
if(event.keyCode==13){
if(c==0){
kaishi();
c=1;
}else{
jieshu();
c=0;
}
}
}
}
function kaishi(){
var guen=document.getElementsByTagName("span");
var sz=new Array('苹果笔记本','ipad','100元充值卡','平板电脑','小米手机','500元现金','耳机');
clearInterval(timer);
timer=setInterval(function(){
var i=Math.floor(Math.random()*sz.length);
guen[0].innerHTML=sz[i];
},100);
}
function jieshu(){
clearInterval(timer);
}
</script>
</head>
<body>
<div id="cj">
<span>准备抽奖了</span><br/>
<input id="ks" type="button" value="开始抽奖">
<input id="js" type="button" value="结束抽奖">
</div>
</body>
</html>