0
(新手在這裏)我有一個帶有時間延遲值變量的setTimeout循環。它循環遍歷ul,將一個類添加到列表項中,在預定的時間量之後,它刪除該類並跳轉到下一個列表項;重複該過程直到它已經到達最後(li)在setTimeout循環中以錯誤順序應用時間延遲變量
問題是時間延遲值被錯誤地應用。最後一次延遲值應用於倒數第二個列表項而不是最後一個。
http://jsfiddle.net/bizarroZ/YyDjW/
<style type="text/css" media="screen">
li {display:none;} .go {color:green;display:block}
</style>
<ul>
<li>First Slide</li>
<li>Second Slide</li>
<li>Third Slide</li>
<li>Fourth Slide</li>
<li>Fifth Slide</li>
<li>Sixth Slide</li>
</ul>
<a href="#" class="go-button">GO!</a>
<script type="text/javascript" charset="utf-8">
$(".go-button").click(function() {
$("li:nth-of-type(1)").addClass("go");
var index = 0;
var length = $("ul").children().length;
var delays = [
1000,
1500,
2000,
2500,
3000,
15000
];
function delayNext()
{
setTimeout(function() {
$("ul li:eq(" + index + ")").addClass("go").siblings().removeClass("go");
index++;
if (index == length)
index = 0;
delayNext();
}, delays[index]);
}
delayNext();
});
</script>
叫@ 3nigma後的時間 - 這似乎不工作它仍然在做同樣的事情。如果您點擊jfiddle結果面板上的go鏈接,您會看到最後一次延遲值應用於倒數第二個列表項,而不是最後一個列表項。 http://jsfiddle.net/YyDjW/16/ –
15000毫秒後它顯示**第六張幻燈片** ?? – Rafay
@ 3nigma - 對不起,我感謝你的努力 - 我的意思是,我需要第六張幻燈片持續15秒 –