能冒泡的事件

能冒泡的事件

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

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

Event TypeBubbling 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 TypeBubbling phase
DOMActivate
DOMAttrModified
DOMCharacterDataModified
DOMFocusIn
DOMFocusOut
DOMNodeInserted
DOMNodeInsertedIntoDocument
DOMNodeRemoved
DOMNodeRemovedFromDocument
DOMSubtreeModified
keypress

H5 还定义了一些新事件:

  • media相关事件,都不冒泡
  • drag相关事件 dragstart 、 drag 、 dragenter 、 dragexit 、 dragleave 、 dragover 、 drop 、 dragend均冒泡
  • 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
}
//....
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值