动态添加jQuery的事件处理程序以动态HTML

我有一个div节，我通过动态jQuery的AJAX填充：动态添加jQuery的事件处理程序以动态HTML

$('#treeview').append(data.d);

如果数据是一群具有不同ID的嵌套的div。

我也有一些jQuery代码，使div的成树状，具有+/-展开/折叠和动态数据人口：

$('div.tree div:has(div)').addClass('parent'); // Requires jQuery 1.2! 
    $('div.tree div').click(function() { 
     var o = $(this); 
     o.children('div').toggle(); 
     o.filter('.parent').toggleClass('expanded'); 
     BindGridView($(this).attr('id')); 
     return false; 
    });

的问题是，当我的div粘贴到主树形div一切都很好。当我动态创建完全相同的文本时，是的，我比较了它，展开/折叠&动态数据填充不起作用;不过，我可以在我的页面上看到正确的div布局。

我猜，我需要添加单击事件& addClass当我做

$（“＃树视图”）追加（data.d）。

但我无法弄清楚如何。

来源

2011-01-24 mike

如果要向DOM动态添加元素，绑定到选择器的现有事件处理程序将不起作用（如click）。

您需要使用live函数才能捕获新创建的DOM元素的事件。

应当注意（as it was in the comments by Zach L），截至jQuery 1.7live已被弃用，取而代之的on。一般建议是相同的（追踪动态元素），只是机制（on vs live）已更改。

来源

2011-01-24 19:13:11 casperOne

类似$（＃树视图）.live（ “点击”，函数（）{VAR O = $（本）; o.children（ 'DIV'）切换（）; o.filter（” .parent '）toggleClass。（' 扩大 '）; BindGridView（$（本）.attr（' 身份证'））; 返回FALSE; }）; – mike 2011-01-24 19:16:29

您可以使用delegate()或live()将事件处理程序绑定到动态元素。在大多数情况下，除非您无法预测动态元素在DOM中的存在位置，否则delegate()将是最有效的路线。

来源

2011-01-24 19:46:43

live()已弃用。

从docs：

使用.on()附加事件处理程序。旧版本jQuery的用户应优先使用.delegate()而不是.live()。

来源

2012-03-09 21:06:02

创建动态可点击对象也让我受到了一段时间的困扰。我无法让委托（）函数工作。后来我发现这个例子 http://www.rahulsingla.com/blog/2011/03/jqueryui-adding-removing-buttons-dynamically-from-a-jqueryui-dialog

，并修改为

var buttonClear = $('#formResult').parent().find('#formMessage'); buttonClear.append("<input type='button' value='Clear message' id='clear'>");

$("#clear").click(function() { //在这里做的按钮点击动作 });

的formResult的表格ID已经在该页面和formMessage是在表单之后显示的动态添加消息已提交。该脚本将一个按钮添加到窗体的末尾以清除消息。

来源

2012-03-28 20:52:18

动态添加jQuery的事件处理程序以动态HTML

回答

相关问题