javascript - $.each 内的 setTimeout 不会遵守时间安排

Question

我想要备份、删除列表中的每一项，并在 1 秒后追加每一项。

我正在尝试这样:

var backup = $('#rGallery').html();
$('#rGallery li').remove();
console.log($(backup).filter('li').length); /* it logs like 135 */
$(backup).filter('li').each(function(){
    var the = $(this);
    var timeout = setTimeout(function(){
        console.log(the.html()); /* it logs the html, but all at the same time*/
        $('#rGallery').append('<li>'+the.html()+'</li>');

        /*return*/
    },1000);
});

它的工作原理，项目被删除然后再次追加，问题是它们在 1 秒后全部被追加。而不是每个都比前一个等待 1 秒。

我在这里缺少什么？

Answer 1

因为您告诉它们全部在一秒钟内运行，所以它们不会添加到某个神奇队列中并排队等待开始计数。

$(backup).filter('li').each(function(index){  //added index here
    var the = $(this);
    var timeout = setTimeout(function(){
        console.log(the.html()); /* it logs the html, but all at the same time*/
        $('#rGallery').append('<li>'+the.html()+'</li>');

        /*return*/
    },1000*(index+1)); //multiplied it here
});