将事件附加到使用jQuery动态添加的元素上

Question

这是我的代码：

$("#strong-against .pick .data .actions .btn-success").on("click", function () {
    //Magic here.
});

我读到我应该使用.on()因为它可以将事件动态地附加到添加的项目上，即使文档完成加载后也是如此。

但是，在动态加载这些项目之后，不会触发该事件。 如何使文件加载后添加的所有项目都能被收听？

Answer 1

尝试，

$(document).on("click", "#strong-against .pick .data .actions .btn-success", function () {
    //Magic here.
});

请按照2个步骤为动态元素绑定事件处理程序，

1. 查找将动态向其添加元素的最接近的父元素。
2. 使用动态元素选择器作为第二个参数将处理程序绑定到父元素。

因此，如果页面加载#strong-against存在#strong-against ，那么您可以，

 $("#strong-against").on("click", ".pick .data .actions .btn-success", function () {
    //Magic here.
 });