Question

我有以下几乎完美的代码，但它多次克隆相同的div。

不幸的是，一旦你选择了它并取消选择它，如果你选择其他的话，它会开始显示倍数。我认为这与克隆有关。

function selectGameItem() {

    $('.inventory-item').on('change', function() {

        var cloneDiv = $(this).clone();

        if($(this).parent('.game-inventory').length) {

            $('.receive-window').append(cloneDiv);
            $(this).addClass('selected-item');

        } else {

            $(this).remove();
            $('.game-label-' + inventoryValue).removeClass('selected-item');

        }

        selectGameItem();

    });

    }

}

Answer 1

移除对selectGameItem();处理程序的最后一行的change的调用。它将为已经有处理程序的元素调用.on('change')，因此下次事件发生时将运行重复处理程序，然后当它们运行时，它们再次调用selectGameItem()并绑定更多处理程序，等

如果你有那条线来将change处理程序绑定到克隆的项目，那么你就不需要了。你也可以use .clone(true) to clone the event handlers。或，可能更好，只需通过更改此行来使用委托事件处理程序：

$('.inventory-item-hold').on('change', function() {

为：

$(document).on('change', '.inventory-item-hold', function() {

这将自动使用动态添加的具有'.inventory-item-hold'类的任何元素。（理想情况下，您不会使用document，您可以使用最近的共同祖先元素用于所有'.inventory-item-hold'元素。）

jQuery clone创建多个相同的div

1 个答案: