循环延迟jquery/js

Question

我有红绿灯 - 3种颜色:

<div class="green" id="ready"></div>
<div class="orange" id="steady"></div>
<div class="red" id="go"></div>

和数组:

var status = ["ready", "steady", "go"];

我想在无限循环中添加和删​​除类(模仿闪烁)有一些延迟,但是这段代码一次性完成.我怎么解决呢？

jQuery.each(status, function() {
    setTimeout(function() {
        $("#" + this).addClass('active');
    }, 3000);
});

Answer 1

http://jsfiddle.net/9feh7/

您将所有设置为立即运行.每次乘以索引.

$('#ready, #steady, #go').each(function(i) { 
    var el=$(this);
    setTimeout(function() { 
        el.addClass('active');
    }, i * 3000); 
});

注意,i在第一个instace是0,所以如果你想#ready等待3秒使用(i+1) * 3000

此外,$('#'+this)语法不正确$(this),但是在setTimeout中不起作用.

使用setInterval而不是setTimeout运行infinate(除非清除)循环.