<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>each</title>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<ul>
<li class="on">0</li>
<li class="on">0</li>
<li class="on">0</li>
<li class="on">0</li>
<li class="on">0</li>
<li class="on">0</li>
<li class="on">0</li>
<li class="on">0</li>
</ul>
<script type="text/javascript">
var num = 0,
timer = null;
$(".on").each(function (index, value) {
timer = setInterval(function(){
if (num == 900) {
clearInterval(timer);
}else{
num++;
}
$(value).text(num);
},50)
})
</script>
</body>
</html>
第一個(gè)疑問if(num==1000)和if(num==900)得到的最後樣子不同? num==900時(shí),除了最後一個(gè)差幾個(gè)900,其他的都是900,而1000時(shí),li可以全變成1000?
第二個(gè)疑問定時(shí)器裡的函數(shù)寫成這樣為什麼只有最後一個(gè)li停了其他的li停不下來
timer = setInterval(function(){
if (num == 998) {
clearInterval(timer);
}
num++;
$(value).text(num);
},50)
timer作為全域變量,他的引用指向了最後一個(gè)綁定的定時(shí)器,當(dāng)clearInterval時(shí)只有最後綁定的那個(gè)定時(shí)器被停止了,數(shù)字不再變化僅僅是因?yàn)閚um不再增加了,你可以在定時(shí)器裡console.log(num),就會(huì)發(fā)現(xiàn)只有最後的定時(shí)器停下來了
至於為什麼1000的是這樣,900不是,是因?yàn)?000/8能整除,取決於li元素的個(gè)數(shù),巧合而已,沒有特別原因