Jquery 无法识别项目

Question

我正在单击时将 li 从另一个 ul 移动到 ul，这可能是双向的。在我替换类后，jquery 无法识别替换的类。

$('.web').click(function() {
console.log('Append to deposit');
$('#deposit').append($(this).addClass('deposit').removeClass('web'));
});
$('.deposit').click(function() {
console.log('Append to web');
$('#web').append($(this).addClass('web').removeClass('deposit'));
});

结果始终是"追加到Web"，因为当调用页面时，Web 类中没有任何项目。

问题是为什么不移动 2 种方式，我将如何解决它？

Answer 1

如注释中所述，您只需要为这些"动态"元素委派事件。它们被认为是"动态的"，因为它们在 DOM 结构中移动。

因此，代码中的更改很简单：

$('#web').on('click','.web',function() {
console.log('Append to deposit');
$('#deposit').append($(this).addClass('deposit').removeClass('web'));
});
$('#deposit').on('click','.deposit',function() {
console.log('Append to web');
$('#web').append($(this).addClass('web').removeClass('deposit'));
});