2010-04-18 121 views
18

我只想获得关于冒泡和捕获之间JS的更好模式的事件委托的一般共识。事件捕获vs事件冒泡

现在我明白,根据特定的用例,人们可能想要使用捕获阶段而不是冒泡,反之亦然,但我想了解什么委派模式更适合大多数一般情况,为什么(对我来说似乎冒泡模式)。

或者换句话说,W3C addEventListener实现背后有一个理由支持冒泡模式。 [只有当您指定第三个参数及其真实时才会启动捕获。然而,你可以忘记第三个参数和冒泡模式被踢入]

我查了JQuery的绑定函数来得到我的问题的答案,它似乎甚至不支持捕获阶段的事件(它似乎我因为IE不支持捕捉模式)。

所以看起来像冒泡模式是默认选择,但为什么?

+0

可能重复[什么是事件冒泡和捕获?](https://stackoverflow.com/questions/4616694/what-is-event-bubbling-and-capturing) – 2017-07-05 17:19:12

回答

10

过去,这是一个平台问题,Internet Explorer有一个冒泡模型,而Netscape更关注于捕获(但同时支持两者)。

W3C模型要求您能够选择您想要的。

我认为冒泡更受欢迎,因为如前所述,有些平台只支持冒泡... 它有点像“默认”模式。

你选择哪一个很大程度上是你正在做的和你对什么有意义的产物。

+3

,冒泡似乎是默认选择。 “在Prototype 1.6之前,Event.observe支持第四个参数(useCapture),它是一个布尔值,表示是使用浏览器的捕获阶段还是冒泡阶段,因为MSIE不支持捕获阶段,我们从1.6中删除了这个参数,以免给用户一个错误的印象,即他们可以在所有浏览器中使用捕获阶段。“ [http://api.prototypejs.org/dom/event/observe/] – Rajat 2010-04-20 00:33:25

-1

我不确定,但我敢肯定,任何你可以做的冒泡你可以做与捕捉,反之亦然。

这个想法,你会有一些事件冒泡和一些捕获在同一个应用程序听起来像一个很好的方式,使事情变得非常混乱。我说的是,我不认为冒泡和捕捉真的很重要。重要的是你选择一个并坚持下去。

W3C的API通常包含这样的事物,他们有很多没有人真正关心的功能。也许这是另一个好的默认值可以消除对配置甚至整个功能的需求的例子。

+3

焦点/模糊事件不会冒泡,但可以在捕获阶段在更高级别进行委派 - http://www.quirksmode.org/blog/archives/2008/04/delegating_the.html – 2010-08-13 15:08:52

+1

换句话说,冒泡不适用于焦点/模糊,但捕获。这对于模拟仅限IE的focusin/focusout的行为很有用。 冒泡和捕获之间的其他区别仅在想要捕捉事件并防止冒泡等时才会出现。 – thomasrutter 2011-04-06 06:21:18

+1

如果您想在冒泡阶段放弃处理程序,捕获也很有用。 – sandstrom 2012-07-12 08:20:47

1

This test表明在泡泡上使用捕获有轻微的性能优势。即使没有处理事件一旦被处理,但是当它离开时,它是微不足道的。我想复杂的DOM会夸大两者之间的性能差异。

7

在阅读JavaScript:权威指南第5版时,我遇到了第422页上的示例17-4,该示例定义了一个用于拖动绝对定位元素的函数。在该示例中,函数drag()在文档元素的onmousedown属性中调用。该函数根据添加到根文档元素的处理程序查询的鼠标位置变化来重新定位元素,以捕获mousemove和mouseup事件。他们捕捉到的文档中,这些事件的原因如下:

重要的是要注意的是,鼠标移动和MouseUp处理程序被注册为捕获的事件处理程序,因为用户可以移动鼠标低于文档元素更快的可以遵循这一点很重要,其中一些事件发生在原始目标元素之外。

这表明捕获事件时响应更快的优势。

+3

听起来对我来说,就像他们使用捕获来获取在冒泡阶段绑定的事件一样,而不一定是因为任何性能增益。 – Joel 2012-10-05 10:33:41