timer=null;
flag=0;
window.οnlοad=function(){
var title=document.getElementById('title'),
play=document.getElementById('play'),
stop=document.getElementById('stop');
//开始抽奖
play.οnclick=playFn;
stop.οnclick=stopFn;
//键盘事件 event的keyCode属性可获得键盘上对应的键盘码值,onkeydown键盘一直按下时触发事件，onkeypress数字键盘按下时，onkeyup键盘松开时触发事件
document.οnkeyup=function(event){
event=event || window.event;
//console.log(event.keyCode);
if(event.keyCode==13){//回车键
if(flag==0){
playFn();
flag=1;
}else{
stopFn();
flag=0;
}
}
}
}
function playFn(){
var title=document.getElementById('title'),play=document.getElementById('play');
clearInterval(timer);//清除定时器
timer=setInterval(function(){
var randomm=Math.floor(Math.random()*data.length);//生成0-8之间的随机数
//console.log(random);
title.innerHTML=data[randomm];
},50);
play.style.background='#999';
}
function stopFn(){
var play=document.getElementById('play');
clearInterval(timer);
play.style.background='#036';
}
<!DOCTYPE html>
<html>
<head>
<title>抽奖系统</title>
<meta charset="utf-8"/>
<script src="choujiang2.js" type="text/javascript" charset="gbk"></script>
<style>
*{margin:0;padding:0;}
.main{width:500px;height:300px;position:absolute;left:50%;top:50%;margin-left:-250px;margin-top:-150px;}
.title{width:300px; height:100px;font-size:40px;font-weight:bold;color:#F00;text-align:center;}
.btns{width:250px;height:30px;text-align:center;margin-left:40px;}
.btns span{display:block;float:left;width:100px;height:35px;line-height:35px;background:#036;
border:1px solid #eee;border-radius:7px;margin-right:10px;color:#fff;text-align:center;vertical-align:center;
}
</style>
</head>
<body>
<div class="main">
<div id="title" class="title">开始抽奖啦!</div>
<div class="btns">
<span id="play">开 始</span>
<span id="stop">结 束</span>
</div>
</div>
<body>
</html>
356
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
