使用jQuery自动将事件处理程序添加到新创建的元素

Question

在文档就绪时，我将此事件处理程序附加到具有类bubbleItemOff的所有元素。 我的问题是，一些bubbleItemOff元素是在触发文档就绪事件后动态创建的。

有没有办法自动将事件处理程序添加到新创建的元素中，或者在创建元素后是否必须显式执行此操作？

  $(function() {
      $('.bubbleItemOff').mouseenter(function(e) 
       {
          //...
       });
   });

Answer 1

您可以在委派事件方法中使用jQuery on方法：

$(".parentItem").on("mouseenter", ".bubbleItemOff", function(e) {
    //
});

此处.parentItem指的是.bubbleItemOff的任何父级。

Answer 2

使用on()方法在公共父元素上使用事件委托（假设您使用的是jQuery 1.7.x +），例如

$(function() {
    $('body').on('mouseenter', '.bubbleItemOff', function(e) 
    {
     ...
    }
}

如果您使用的是旧版本，请改用delegate()。使用body

的第一个常见父元素更改.bubbleItemOff