每个 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 还定义了一些新事件:
dragstart
、 drag
、 dragenter
、 dragexit
、 dragleave
、 dragover
、 drop
、 dragend
均冒泡popstate
,hashchange
冒泡(从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