javascript - jQueryeach() 只选择最后一个值

Question

我有 2 个列表。

第一个列表包含所有数据。另一种是占位符。我有一个按钮可以采用默认值。它将第一个列表克隆到占位符中。

现在我使用此代码来提醒所有找到的data-id。效果很好。

但是当我尝试将这些数据属性粘贴到占位符上时，它总是粘贴每个占位符中的最后一个值。

$(".default").click(function() {

    $("li.to-drag").each(function(index) {

        $("li.placeholder").addClass("dropped");

        var clone = $(this).clone();
        var day = $(this).attr("data-id");

            $("li.placeholder").each(function(){
                $("li.placeholder").attr("data-id", index);
            });

        clone.hide().appendTo("." + index).fadeIn(1500);

    });

    var dropped = $(".dropped").length;
    var original = $(".placeholder").length;

    if (dropped === original) {

        $("li.placeholder").removeClass(blank_placeholder);
        $("#dropzone").append('<li class="placeholder blank" data-id="" data-order=""></li>');

        init();
    }

});

我该如何解决这个问题？

解决方案:

我必须在迭代 .to-drag 类的另一个循环之外执行第二个 each() 循环。

$("li.placeholder").each(function(){
    var day = $(this).children().attr("data-id");
    $(this).attr("data-id", day);
});

Here is a jsfiddle

Answer 1

在 .each() 循环中，必须使用 $(this)，否则每次循环重复时都会更改所有内容。

因此只需更改代码的以下部分:

$("li.placeholder").each(function(){
    $(this).attr("data-id", index);
});