其實(shí)這里面還是有個(gè)小BUG的。 我們?cè)谟|發(fā)onclick事件時(shí)，會(huì)執(zhí)行playFun函數(shù)。 但是，如果我們想用鍵盤事件來(lái)關(guān)閉的話會(huì)出現(xiàn)問(wèn)題。 這樣用戶體驗(yàn)并不好。
xiecg53
2014-07-30
4 回答
舉報(bào)
0/150
提交
取消
2014-10-28
這個(gè)問(wèn)題很好解決，就把flag的值，在playFun和stopFun里面在在重生一下，就行了。
2014-09-10
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無(wú)標(biāo)題文檔</title>
<style>
*{margin:0; padding:0;}
#title{
width:400px;
height:60px;
margin:0 auto;
padding-top:30px;
font-size:24px;
font-weight:blod;
line-height:60px;
text-align:center;
color:#f00;
}
#btns{
width:204px;
height:30px;
margin:0 auto;
}
#btns span{
width:80px;
height:28px;
display:block;
background:#036;
float:left;
margin-right:20px; /*注意border的寬度和margin的大小*/
border:1px solid #036;
border-radius:7px;
line-height:28px;
text-align:center;
color:#fff;
font-weight:blod;
font-family:"microsoft yahei";
font-size:20px;
cursor:pointer;
}
</style>
<script>
window.onload = function ()
{
var oTitle = document.getElementById('title');
var oPlay = document.getElementById('play');
var oStop = document.getElementById('stop');
var array = ['iphone6','iWatch','MX4','Canon','iMac','100元充值卡','200元超市購(gòu)物卡','謝謝參與','蘋(píng)果筆記本','智能手環(huán)'];
var timer = null;
var flag = 0; //設(shè)置一個(gè)標(biāo)志變量
//鼠標(biāo)點(diǎn)擊事件
oPlay.onclick = startMove; //為什么此處加（）不行
oStop.onclick = stopMove;
//鍵盤事件
document.onkeyup = function (e)
{
var oEvent = e || event;
if(oEvent.keyCode == 13)
{
if(flag == 0)
{
startMove(); //為什么此處非要加（）
flag = 1;
}
else
{
stopMove();
flag = 0;
}
}
}
function startMove()
{
if(flag == 0)
{
clearInterval(timer);
timer = setInterval(function (){
var rand = Math.floor(Math.random()*array.length);
oTitle.innerHTML = array[rand];
}, 50);
oPlay.style.background = '#999';
}
flag = 1;
}
function stopMove()
{
if(flag == 1)
{
clearInterval(timer);
oPlay.style.background = '#036';
}
flag = 0
}
}
</script>
</head>
<body>
<div id="title">
開(kāi)始抽獎(jiǎng)啦！
</div>
<div id="btns">
<span id="play">開(kāi)始</span>
<span id="stop">停止</span>
</div>
</body>
</html>
2014-08-11
flag的改變應(yīng)該在funplay和funStop里
2014-07-31
確實(shí)，如果用鼠標(biāo)開(kāi)始，但是想用鍵盤結(jié)束的話得按兩次enter才可以。