2

我在我的网站上动态生成按钮。要检测click这些元素的状态，我相信您需要使用 jQuery 的on(). 我尝试了以下方法，但似乎不起作用。难道我做错了什么？

$('.press').on('click', function() {
    alert('clicked'); //Does not trigger on dynamic elements
});

当您查看我的JSFiddle时，请注意单击动态生成的按钮不会产生结果。

4

4 回答 4

8

当您想委托​​事件处理时，选择器会继续包含动态元素的元素（一直到document），第二个参数.on是选择器：请参阅文档

$(document).on('click', '.press', function () { ...

我建议在使用委托时尝试使用尽可能具体的选择器，以便需要最少的遍历。不过，它通常不会产生太大的影响。

于 2012-12-06T21:37:14.400 回答
3

对于动态生成的元素，您需要使用事件委托。.on() 需要应用于父元素才能进行委托

于 2012-12-06T21:37:44.337 回答
2

委托活动

$('body').on('click','.press', function() {
    alert('clicked'); // now it triggers on dynamic elements
});

你可以用static parent container..替换身体

not available in the DOM当您附加事件时，您的方法将不起作用，因为元素仍然存在。

检查小提琴

于 2012-12-06T21:36:29.633 回答
2

它应该是

$(document).on('click', ".press", function() {
    alert('clicked'); 
});

$('.press')查找当前文档中的所有元素并将事件绑定到它们上，因此它不适用于您稍后添加的元素，因为它们在被选择时不存在。

$(document)选择document始终存在于任何地方和任何地方的 ，并将事件绑定到它。然后它过滤.press，以便只有匹配.press的元素才会真正调用回调。

请注意，您应该选择一个父元素，它是元素的共同父.press元素并且当时存在，而不是使用document.

于 2012-12-06T21:36:37.633 回答