首页 > 其他 > 详细

能冒泡的事件

时间:2015-12-27 18:57:55      阅读:218      评论:0      收藏:0      [点我收藏+]

每个 event 都有一个event.bubbles属性,可以知道它可否冒泡。(ref:W3定义的Event Interface)

当然 W3 DOM Level 3 Events 的细则里已经附上这个表格了:

Event Type Bubbling phase
abort ?
beforeinput ?
blur ?
click ?
compositionstart ?
compositionupdate ?
compositionend ?
dblclick ?
error ?
focus ?
focusin ?
focusout ?
input ?
keydown ?
keyup ?
load ?
mousedown ?
mouseenter ?
mouseleave ?
mousemove ?
mouseout ?
mouseover ?
mouseup ?
resize ?
scroll ?
select ?
unload ?
wheel ?

还附上了 Legacy Events(旧浏览器支持的非标准遗留事件)的 bubble 属性。

Event Type Bubbling phase
DOMActivate ?
DOMAttrModified ?
DOMCharacterDataModified ?
DOMFocusIn ?
DOMFocusOut ?
DOMNodeInserted ?
DOMNodeInsertedIntoDocument ?
DOMNodeRemoved ?
DOMNodeRemovedFromDocument ?
DOMSubtreeModified ?
keypress ?

H5 还定义了一些新事件:

  • media相关事件,都不冒泡
  • drag相关事件 dragstartdragdragenterdragexitdragleavedragoverdropdragend均冒泡
  • History相关事件popstatehashchange冒泡(从window开始……所以意义在哪里),pagetransition不冒泡

还有很多H5新事件,大多在草案阶段,就不一一翻开了。

此外,这里还有一个关于IE的事件列表,http://www.feiesoft.com/html/events.html

事件冒泡是我们实现事件代理(委托)的关键,在avalon1.6中,默认让能冒泡的事件都使用事件代理实现了!

var canBubbleUp = {
    click: true,
    dblclick: true,
    keydown: true,
    keypress: true,
    keyup: true,
    mousedown: true,
    mousemove: true,
    mouseup: true,
    mouseover: true,
    mouseout: true,
    wheel: true,
    mousewheel: true,
    input: true,
    change: true,
    beforeinput: true,
    compositionstart: true,
    compositionupdate: true,
    compositionend: true,
    select: true,
    cut: true,
    paste:true,
    focusin: true,
    focusout: true,
    DOMFocusIn: true,
    DOMFocusOut: true,
    DOMActivate: true,
    dragend:true,
    datasetchanged:true
}
if (!W3C) {
    delete canBubbleUp.change
    delete canBubbleUp.select
}
//....

能冒泡的事件

原文:http://www.cnblogs.com/rubylouvre/p/5080464.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!