javascript - jQuery 点击事件在 appenTo 后丢失

Question

单击按钮后，我使用 appendTo 在两个列表之间移动列表项。该按钮位于每个 li 元素中。每个 li 都有两个按钮，一次只有一个可见，具体取决于 li 当前所在的列表。

函数如下:

// 'this' is the first list
// Click Handler for remove and add buttons
$(this.selector + ', ' + settings.target + ' li button').click(function(e) {

    var button = $(e.target);
    var listItem = button.parent('li');

    listItem.children("button").toggleClass("hidden");

    if (button.hasClass("assign")) {
        // Add Element to assignment list
        listItem.appendTo(settings.target);
    }
    else
        if (button.hasClass("remove")) {
            // Remove Element from assignment list
            listItem.appendTo(source);
        }
})

只要列表项驻留在原始li中，就会触发按钮中的点击事件。但是，一旦使用 listItem.apendTo 将其移动到另一个列表。单击元素不再触发。为什么会这样？我在文档中找不到任何关于此的内容。

Answer 1

有时，如果您的脚本首次加载时 DOM 中不存在某些内容，jQuery 将无法找到该内容。如果它是一个动态创建的元素，请尝试用 'on' 替换您的点击事件处理程序。

而不是:

$(".aClass").click(function(){
    // Code here
})

尝试:

$("body").on("click", ".aClass", function(){
    Code here
})

http://api.jquery.com/on/