能冒泡的事件
每个 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 } //.... |
如果您觉得此文有帮助,可以打赏点钱给我支付宝1669866773@qq.com ,或扫描二维码


机器瞎学/数据掩埋/模式混淆/人工智障/深度遗忘/神经掉线/计算机幻觉/专注单身二十五年
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
2013-12-27 JavaScript 18岁生日快乐
2012-12-27 6 个强大的 HTML5 应用在线开发工具
2011-12-27 轮回? webkit系的滤镜
2009-12-27 事件冒泡