在setTimeout循環中以錯誤順序應用了時間延遲變量

Question

（這里的新手）我有一個setTimeout循環，其中包含時間延遲值的變量。 它循環遍歷ul，將一個類添加到列表項，經過預定時間后，它將刪除該類並跳轉到下一個列表項； 重復該過程，直到達到最后一個（li）

問題是時間延遲值使用不正確。 最后的時間延遲值將應用於倒數第二個列表項，而不是最后一個。

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>

Answer 1

像這樣的東西...雖然不是一個好的解決方案，但它確實可以實現您的意圖...

您的代碼中的問題
在單擊事件要添加的類go到這是第一張幻燈片的第一個孩子和setTimeout你又指派類go 第一張幻燈片 :eq選擇如下從零開始的索引 ，以便你的時間達到5滑動您的計數器設置到15000毫秒，即再次調用delayNext()之后的時間