Question

我正在开发一个用户能够执行一些实时搜索功能的项目。当显示实时搜索的结果时，通过JQuery Ajax，我需要用户能够单击显示的结果之一并在页面的其他位置创建克隆。我发现的问题是，由于这些新的实时搜索结果未在第一页加载时处理，我认为它们是DOM中不存在的“幻像代码”。我已经对JQuery的on（）以及bind（）函数做了一些研究，但不确定如何将它们实现到我自己的上下文中。

这是我的JQuery

$(".add").click(function() {
        $(this).parent("li").clone(true).appendTo(".doc_list:first");                       

});

在该片段中（this）引用我的按钮，该按钮存在于LI元素（父元素）内部，通过实时搜索结果动态创建。我需要复制那个LI元素。

如果需要更多代码，请告知我们。

Answer 1

在页面加载后将.add按钮添加到DOM，即。动态，所以你需要一个委托事件处理程序（aka live）。

$(".doc_list").on('click', '.add', function() {
    $(this).parent("li").clone(true).appendTo(".doc_list:first");
});

这里我将.doc_list用作容器，但如果.doc_list也是动态元素，则在页面加载时将其替换为属于DOM的其他静态元素。

Answer 2

$("Static-container").on('click', '.add', function() {
        $(this).parent("li").clone(true).appendTo(".doc_list:first");                       
});

Static-container是最接近所有动态添加的.add元素的元素的选择器。

JQuery .on（） - 克隆动态内容

2 个答案: