jQuery等价于JavaScript的addEventListener方法

我试图find这个JavaScript方法调用的jQuery等价物：

document.addEventListener('click', select_element, true); 

我已经得到：

 $(document).click(select_element); 

但是并没有达到相同的结果，因为JavaScript方法的最后一个参数是一个布尔值，表示事件处理程序是否应该在捕获或冒泡阶段执行（根据我对http://www.quirksmode.org的理解） /js/events_advanced.html ） – 被遗漏。

如何使用jQuery指定该参数或以其他方式实现相同的function？

Answer 1

并不是所有的浏览器都支持事件捕获（例如，小于9的Internet Explorer版本不支持），但都支持事件冒泡，这就是为什么在所有跨浏览器抽象（包括jQuery）中将处理程序绑定到事件的原因。

在jQuery中最接近你要找的东西是使用bind() （取代jQuery 1.7+中的on() ）或特定于事件的jQuery方法（在本例中是click() ，无论如何都是在内部调用bind() ） 。 所有这些都使用了一个浮动事件的冒泡阶段。

Answer 2

从jQuery 1.7开始， .on()现在是绑定事件的首选方法，而不是.bind() ：

来自http://api.jquery.com/bind/ ：

从jQuery 1.7开始，.on（）方法是将事件处理程序附加到文档的首选方法。 对于较早的版本，.bind（）方法用于将事件处理程序直接附加到元素。 处理程序被附加到jQuery对象中当前选定的元素，所以这些元素必须存在于对.bind（）的调用发生的地方。 为了更灵活的事件绑定，请参阅.on（）或.delegate（）中的事件委托的讨论。

文档页面位于http://api.jquery.com/on/

Answer 3

最接近的是绑定函数：

http://api.jquery.com/bind/

 $('#foo').bind('click', function() { alert('User clicked on "foo."'); }); 

Answer 4

有一点需要注意的是，jQuery事件方法不会在包含SVG DOM的embed标签上触发/陷印load在embed标签中将其作为单独的文档加载。 我发现在这些上load事件的唯一方法是使用原始JavaScript。

这不会工作（我试过/ bind / load方法）：

 $img.on('load', function () { console.log('FOO!'); }); 

但是，这工作：

 $img[0].addEventListener('load', function () { console.log('FOO!'); }, false); 

Answer 5

您现在应该使用.on()函数来绑定事件。

Answer 6

对于标准JavaScript的这个问题Mozilla开发networking（MDN），这是一个很好的解决scheme（如果你不想依赖于jQuery或更好地理解它）：

https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener

以下是上述处理中链接的事件stream程的讨论：

http://www.w3.org/TR/DOM-Level-3-Events/#event-flow

一些关键点是：

• 它允许为事件添加多个单独的处理程序
• 它可以让你更好地控制阶段，当听者被激活（捕获与冒泡）
• 它适用于任何DOM元素，而不仅仅是HTML元素
• 传递给事件的“this”的值不是全局对象（window），而是元素被触发的元素。 这很方便。
• 传统IE浏览器的代码很简单，包含在“传统的Internet Explorer和attachEvent”
• 如果将处理程序包含在匿名函数中，则可以包含参数