如何用 bubbles 参数让自定义事件支持在 DOM 树中冒泡
自定义事件默认不冒泡必须在构造时通过 options 对象显式设置 bubbles: true 才能生效如 new Event(e, {bubbles: true})触发需调用 dispatchEvent()监听可直接用 addEventListener冒泡阶段自动传递。默认情况下自定义事件通过 CustomEvent 或 Event 构造函数创建**不会冒泡**即使你手动设置 bubbles: true也必须在构造时正确传入配置对象否则无效。确保 bubbles 参数生效的关键用 Event 构造函数或 CustomEvent 的 options 对象直接写 new Event(myevent, { bubbles: true }) 是最简洁可靠的方式。注意不能只传字符串必须传第二个参数options 对象且其中明确包含 bubbles: true。错误写法new Event(myevent) —— 此时 bubbles 默认为 false 正确写法new Event(myevent, { bubbles: true }) 使用 CustomEvent 同样有效new CustomEvent(myevent, { bubbles: true, detail: { msg: hello } })触发后需在目标元素上调用 dispatchEvent创建事件对象只是第一步你还得显式调用 element.dispatchEvent()。冒泡行为由事件系统自动处理前提是该事件对象本身支持冒泡即 bubbles true且目标元素是 DOM 节点。 幻导航网 发现优质实用网站,开启网络探索之旅