抽奖系统(键盘事件)

最新推荐文章于 2021-12-11 02:43:18 发布

bobobe

最新推荐文章于 2021-12-11 02:43:18 发布

阅读量913

点赞数

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.csdn.net/bobobe/article/details/44172149

版权

javascript 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

keydown:当用户按下键盘任意键触发，如果按住不放则重复触发。

keypress：当用户按下字符键触发，如果按住不放则重复触发。

keyup：释放按键时触发。

<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="content-type" content="text/html" charset="UTF-8">
   <title>查询</title>
   <link type="text/css" href="chaxun.css" rel="stylesheet"/>
</head>
<body>
<div id="chou">开始抽奖啦</div>
    <div id="btn">
      <p>
     	<span id="begin">开始</span>
        <span id="end">停止</span>
     </p>
    </div>
</body>
<script>
     var flat=0;
     var timer=null;
     var thing=new Array('ipone6','小米','ipad','谢谢参与','再接再厉','笔记本电脑','bike');
     var chou=document.getElementById('chou');
     var begin=document.getElementById('begin');
     var end=document.getElementById('end');
     begin.οnclick=function(){
     	clearInterval(timer);
     	    begin.style.background='blue';
     	    timer=setInterval(function(){
     		var rand=Math.floor(Math.random()*thing.length);
            chou.innerHTML=thing[rand];
     	},50);
     }
     document.οnkeyup=function(event){
     	if(event.keyCode==13)
     	{
     		if(flat==0)
     		{
     		       clearInterval(timer);
     	           begin.style.background='blue';
     	           timer=setInterval(function(){
     		       var rand=Math.floor(Math.random()*thing.length);
                   chou.innerHTML=thing[rand];
     	           },50);
     	           flat=1;
     	     }
     	     else
     	     {
     	     	clearInterval(timer);
     	     	begin.style.background='white';
     	     	flat=0;
     	     }

     	}
     }
     end.οnclick=function(){
     	clearInterval(timer);
     	begin.style.background='white';
     }
</script>
</body>
</html>