又学完了一个imooc课程
练习抽奖小练习
主要是几个dom事件:
keypress 按下任意键执行
keydown 按下字符键执行
keyup 释放键盘执行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<link rel="stylesheet" type="text/css" href="">
<body>
<div>
<center>
<br>
<p>开始抽奖了!</p>
<div id="content" style="margin: 30px; width: 200px;height: 50px;">
</div>
<button id="play">开始</button>
<button id="stop">停止</button>
<p id="result"></p>
</center>
</div>
<script type="text/javascript">
var data=['笔记本','iphone4','iphone6','ipad','ipod','geogoo glasses','macbook','iphone7','thx','hello word'];
var timer=null;
var flag=0;
window.οnlοad=function(){
var play=document.getElementById('play'),
stop=document.getElementById('stop');
play.οnclick=playFun;
stop.οnclick=stopFun;
document.οnkeyup=function(event){
if (event.keyCode==13) {
if (flag==0) {
flag=1;
playFun();
}else{
stopFun();
flag=0;
}
}
}
}
function playFun(){
clearInterval(timer);
timer=setInterval(function(){
var content=document.getElementById('content');
var random=Math.floor(Math.random()*data.length);
content.innerHTML=data[random];
},100);
}
function stopFun(){
clearInterval(timer);
}
</script>
</body>
</html>