Question

好的，所以我有这个代码：

$(this).find('article.loading').each( function(i) {

    var el = this;
        setTimeout(function () {
        $(el).replaceWith($('#dumpster article:first'));
    }, speed);

});

我想用另一个元素替换每个元素，但我想在每次替换之间延迟。

我无法弄清楚为什么这不起作用，它只是在一次超时后替换所有这些。

有什么想法吗？

感谢。

Answer 1

我只是修改你的代码并进行一些改动。只是一个小技巧。

$(this).find('article.loading').each( function(k, v) {
    var el = this;
        setTimeout(function () {
        $(el).replaceWith($('#dumpster article:first'));
    }, k*speed);
});

Answer 2

您正在遍历元素并为每个元素添加一个具有相同配置的计时器。基本上，每个元素立即设置一个新的计时器。在所有计时器的第一个刻度上，元素被更新。每个区间都相同，因此它们似乎同时更新。

您的逻辑需要以计时器为中心。计时器的每个刻度都需要更新集合中的下一个元素。您不需要每个循环，使用计时器和递增的索引作为循环机制，一旦更新了最后一个元素就停止计时器。

var elements = $(this).find('article.loading');
var index = 0;

setTimeout(function () {
    $(elements).get(index).replaceWith($('#dumpster article:first'));
    index++;
}, speed);

如上所述，但请记住也要停止计时器！

Answer 3

这正是Andy McCluggage写的。我觉得这样的事情可以帮到你。

var speed = 1000;

// init timer and stores it's identifier so it can be unset later
var timer = setInterval(replaceArticle, speed);

var articles =  $('article.loading');
var length = articles.length;

var index = 0;
function replaceArticle() {
     articles.eq(index).replaceWith($('#dumpster article:first'));

     index++;

     // remove timer after interating through all articles
     if (index >= length) {
         clearInterval(timer);
     }
}

Answer 4

尝试使用window.setTimeout。

$ .each（）里面的setTimeout

4 个答案: