jQuery .on函数用于将来的元素,因为.live已被弃用

Question

我需要为click未来<div>元素的事件添加一个处理程序,它还不存在.通常情况下,我会使用jQuery的.live函数来处理这个问题,但它现在似乎已被弃用了.on.

要.on以这种方式使用该方法,jQuery建议设置selector参数,以允许创建委托事件,并提供此示例代码:

$("#dataTable tbody").on("click", "tr", function(event){
    alert($(this).text());
});

这一切都很好,但是我为他的初始选择器添加了#dataTable tbody什么呢？请注意,$.on()这不起作用.

Answer 1

jQuery的文档显示你会替换

$(selector).live(event, handler)

同

$(document).on(event, selector, handler)

您还可以选择更精确,并$(document)使用选择器替换元素的静态父级.例如,如果你有一个静态table元素并且tr元素被动态添加到DOM,你可以做类似的事情$('table#id').on('click', 'tr', ...)

$(document).on("click","a.offsite",function(){alert("Goodbye!");}); (5认同)
我可以跳到这里,并提到重要的是你使用.on重载与选择器(如在这个答案中),否则你将无法获得所需的行为(我们想要一个委托事件,请参阅http:// api. jquery.com/on/) (4认同)

Answer 2

我刚发布这个问题时就知道了......对不起!

初始选择器可以是任何父元素.由于我的元素将是身体的直接孩子,我可以body用于选择器:

$('body').on('click', '.my_class', function(event) { ...

这是有效的,因为事件将会起泡.这基本上是正常的鼓泡,带有额外的过滤器.my_class.