沐鳴網址_能冒泡的事件

每個 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相關事件 dragstart 、 drag 、 dragenter 、 dragexit 、 dragleave 、 dragover 、 drop 、 dragend均冒泡
  • History相關事件: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
}
//....

站長推薦

1.雲服務推薦: 國內主流雲服務商,各類雲產品的最新活動,優惠券領取。地址:阿里雲騰訊雲華為雲

2.廣告聯盟: 整理了目前主流的廣告聯盟平台,如果你有流量,可以作為參考選擇適合你的平台點擊進入

鏈接: http://www.fly63.com/article/detial/8573