1.7.2中的jQuery事件委托

有没有办法使用jQuery委托一个事件,该事件将对应于页面上与选择器匹配的所有元素,而不是从$(document)委托?

既然这可能措辞不好,这就是问题:

曾经有jQuery.live将事件委托给匹配选择器的所有元素。 这被jQuery.delegate取代,后者将特定上下文选择器中的事件委托给它的子jQuery.on ,后者又被jQuery.on取代, jQuery.on实际上有相同的function,但在幕后有不同的位(我想象)。

我想要做的是,安全地为我页面上的每个div.foo添加一个事件处理程序,无论它在哪里,或者它可能存在。 根据文档和实证研究,以下内容仅绑定脚本运行时存在的.foo元素。 由于代码可能会在页面上放置.foo元素,因此这并不完全有效。

 jQuery('.foo').on('click', handler); 

由于live已弃用(可能已删除?),我试图不使用它,但我能想出的唯一解决方案是

 jQuery(document).on('click', '.foo', handler); 

但这不是live幕后的活动吗? 更重要的是,有没有重要的理由这样做?

我们专门使用1.7.2版本,但通用的jQuery答案也会有所帮助。

事件从它们的源到它们被委派的任何事物都会冒泡,所以你应该使用jquery()。在什么级别上是最低的公共父级。 如果那是文件,那就这样吧。

否则,如果.foo项目总是在.foocontainer (或其他)中创建,那么您可以在选择器中使用它,即使它们不止一个 – 您最终会附加。

我认为委托回文件的问题是,它可能要求事件冒泡很多次,从而在流程中产生额外的开销,因此最好将事件委托给尽可能靠近源的事件。

你是正确的,因为绑定到文档(如下所示)正是live()作用:

 jQuery(document).on('click', '.foo', handler); 

这很糟糕的原因是因为它不是很有效。 每次在任何地方单击时, document检查它是否在委托元素上。

更好的方法是使用一个元素代替document ,该document是动态附加的document的最近父document ,但在页面加载时可用。 即使这是一个顶级容器,它仍然可以提供将所有内容附加到document的性能优势。