获取jquery .on()以使用动态html

时间:2012-01-16 14:46:51

标签: jquery dhtml

这在jQuery 1.6.4 for dynamic html中运行得很好:

$(".selector").die().live("click", function () {
    alert("clicked");
});

但我在jQuery 1.7.1中注意到.live()已被弃用并被.on()取代。如何将.on()与动态html一起使用?使用.die().on("click", function())不起作用,.off().on("click", function())也不起作用。

谢谢!

1 个答案:

答案 0 :(得分:4)

on方法的工作方式与delegate在旧版jQuery中的工作方式大致相同。您需要在祖先元素上使用它并提供选择器。由于DOM事件从目标中冒出来,它们最终会到达您使用on的祖先元素。当事件到达该元素时,将检查目标以查看它是否与您的选择器匹配。如果是,则执行事件处理程序:

$("#someAncestor").on("click", ".selector", function() {
    //Do stuff
});

自从live添加delegate以来,无需使用delegate。使用$("#someAncestor").delegate(".selector", "click", function() { //Do stuff }); 上面的代码段为:

delegate

onlive效率远远高于live,因为document始终将事件处理程序绑定到on。这意味着必须测试页面上触发的每个事件以查看它是否与选择器匹配,因此应该导致事件处理程序运行。对于{{1}},只有冒泡到祖先元素的事件才需要进行此检查。