Ruby's Louvre

每天学习一点点算法

导航

< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

统计

能冒泡的事件

每个 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
}
//....

如果您觉得此文有帮助,可以打赏点钱给我支付宝1669866773@qq.com ,或扫描二维码

posted on   司徒正美  阅读(16081)  评论(0编辑  收藏  举报

编辑推荐:
· 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 事件冒泡
点击右上角即可分享
微信分享提示