jQuery.live()vs.on.on()方法，用于在加载动态html之后添加单击事件。

Question

jQuery.live()vs.on.on()方法，用于在加载动态html之后添加单击事件。我使用jQueryv.1.7.1，其中显然不推荐.live()方法。我遇到的问题是，当使用以下方法将html动态加载到元素中时：$('#parent').load("http://...");如果我尝试在之后添加一个Click事件，它不会使用以下任何一种方法来注册该事件：$('#parent').click(function() ...);或// according to documentation this should be used instead of .live()$('#child').on('click', function() ...);实现此功能的正确方法是什么？它似乎只适用于.live()，但我不应该使用这种方法。注意，#子元素是一个动态加载的元素。谢谢。

Answer 1

试试这个：

$('#parent').on('click', '#child', function() {
    // Code});

从$.on()文件：

事件处理程序仅绑定到当前选定的元素；它们必须在代码调用时存在于页上。.on().

你的#child元素在调用$.on()在上面，所以事件不受约束(不像$.live()). #parent然而，是吗？存在，因此将事件绑定到该事件是很好的。

以上代码中的第二个参数充当一个“筛选器”，仅在事件冒泡到#parent从…#child.

Answer 2

$(document).on('click', '#selector', function() { /* do stuff */ });

编辑：我提供了更多关于这是如何工作的信息，因为.言语。使用此示例，您将在整个文档上放置一个侦听器。

当你click关于任何元素匹配#selector，事件一直到主文档-只要没有其他侦听器调用event.stopPropagation()方法-它将使事件冒泡为父元素。

不是绑定到特定的元素或元素集，而是侦听来自与指定选择器匹配的元素的任何事件。这意味着您可以创建一个侦听器，一次，它将自动匹配当前存在的元素以及任何动态添加的元素。

这是明智的，原因有几个，包括性能和内存利用率(在大规模应用程序中)。