Question

所以我有一个包含许多其他div的div。这些其他div中的每一个都有一个名为record的类。我只使用这个类来选择所有这些div。

<div id = "resultContainer">
   <div class="record">result1</div>
   <div class="record">result2</div>
   <div class="record">result3</div>
   <div class="record">result4</div>
</div>

我还添加了一个click事件=

$(".record").click(function(e) {
        do stuff here....
    });

现在我想动态添加另一个div。

$("#resultContainer").append("<div class='record'>result5>/div>");

但是现在点击事件没有添加到记录中。

我的想法是创建一个名为update()的函数，该函数执行$(".record....代码并在每次添加记录时调用该函数。但是原来的div不止一次做这个动作！

如何在点击do stuff here...之前将所有div（无论何时添加）添加到$(".save").button({ icons: { primary: 'ui-icon-disk' }, text: false });之前？

谢谢！

另外，我还有动态div上的按钮。因此，能够处理这样的问题的解决方案：{{1}}将是更可取的。

Answer 1

在这种情况下不要使用.live()。这是jQuery's .delegate() method的完美情况，效率更高。

$("#resultContainer").delegate('.record','click',function() {
    // do stuff here...
});

只需要处理resultContainer内的点击，看看它们是否与.record匹配，.live()需要处理页面上的每次点击。

Answer 2

http://api.jquery.com/live/：

为所有人附加一个处理程序与当前相匹配的元素选择器，现在和将来。

$(".record").live("click", function(e) {
    //do stuff here... 
});

Answer 3

从jQuery 1.7开始，您应该使用on()而不是live()或delegate()。来自文档：

从jQuery 1.7开始，.on（）方法提供了附加事件处理程序所需的所有功能。

on()方法应附加到静态父级或document：

$(document).on( 'click', '.record', function(e) {
    // do stuff here....
});

Answer 4

看一下jQuery live（）函数

http://api.jquery.com/live/

您可以为所有div添加事件侦听器，而不管页面中的更改

Answer 5

尝试live（）方法。而不是：

$(".record").click(function(e) {
    do stuff here....
});

试试这个：

$(".record").live(function(e) {
    do stuff here....
});

将click函数添加到动态创建的html标记中

5 个答案: