Question

在使用.each预先添加新内容时，我无法从定义列表中删除最后的DD和DT标记。我的目标是在每次迭代时删除一组DD和DT标记（因为前面添加了新的DD和DT标记）。以下是我正在使用的示例代码：

shouts_list = $("#shouts dl#shouts_list");
$.each(json.shouts, function (id, shout) {
            $("<dt>" + shout.name + "</dt><dd>" + shout.message +  "</dd>").hide().prependTo(shouts_list).slideDown('slow', 'swing', function() {
            $("#shouts_list > dt:last, #shouts_list > dd:last").slideUp('slow', 'swing');
            }).fadeIn();
        });

每次我的json对象包含多个项目时，只会从末尾删除一组DT和DD。

我正在慢慢学习jQuery和JavaScript，并且暂时停留在这个问题上。每次迭代从列表末尾删除项目的好方法是什么？

Answer 1

从列表中只删除了一个元素，因为each循环在第一个json.shouts调用完成之前遍历slideUp中的所有项目（即循环过快或slideUp太慢了）。这意味着每次执行：

$("#shouts_list > dt:last, #shouts_list > dd:last").slideUp('slow', 'swing');

始终会找到列表中的原始最后一项，因此您实际上在同一元素slideUp上调用json.shouts.length次。您需要在每个循环开始之前获取列表中的所有原始项目，并向后计数以为每个添加的新项目删除一个。

这应该可以解决问题：

shouts_list = $("#shouts dl#shouts_list");
var existingDts = shouts_list.find("> dt");
var existingDds = shouts_list.find("> dd");

$.each(json.shouts, function (id, shout) {
     $("<dt>" + shout.name + "</dt><dd>" + shout.message +  "</dd>")
       .hide().prependTo(shouts_list)
       .slideDown('slow', 'swing', function() {
           $(existingDts[existingDts.length - 1 - id]).slideUp('slow', 'swing');
           $(existingDds[existingDds.length - 1 - id]).slideUp('slow', 'swing');
     })
    .fadeIn();
});

jQuery删除.each迭代中的多个最后一项

1 个答案: