JS 中怎么用 event.stopImmediatePropagation 阻止同级其他事件监听器执行-js教程-PHP中文网

event.stopImmediatePropagation()用于阻止同一元素、同一事件类型、同一阶段中尚未执行的同级监听器，同时隐含阻止事件冒泡；而stopPropagation()仅阻止冒泡，不干扰同级其他监听器执行。

js 中怎么用 event.stopimmediatepropagation 阻止同级其他事件监听器执行

event.stopImmediatePropagation() 用于阻止**当前事件阶段中尚未执行的同级事件监听器**（即绑定在同一个元素、同一事件类型、同一捕获/冒泡阶段的其他监听器）继续运行，但它不会影响事件在 DOM 树中的传播（比如冒泡或捕获），这点和 stopPropagation() 不同。

它解决什么问题？

当一个元素上绑定了多个相同事件（如多个 click）监听器时，浏览器默认按注册顺序依次调用。如果你在某个监听器里调用了 stopImmediatePropagation()，那么排在它后面的同级监听器将**完全跳过，不执行**。

关键使用条件

必须在事件处理函数内部调用，且在其他同级监听器触发前（即当前监听器执行过程中）
只对「同一元素 + 同一事件类型 + 同一阶段（都 capture 或都 bubble）」的其他监听器生效
不影响父/子元素上的监听器（即不阻止冒泡或捕获本身）
如果监听器是通过 addEventListener 添加的，且第三个参数为 true（捕获阶段），那它只影响其他捕获阶段监听器；设为 false 或省略，则影响冒泡阶段监听器

简单示例对比

假设：

const btn = document.getElementById('btn');

btn.addEventListener('click', () => {
  console.log('监听器 A');
});

btn.addEventListener('click', (e) => {
  console.log('监听器 B');
  e.stopImmediatePropagation(); // ← 关键：B 执行完就停，C 不会执行
});

btn.addEventListener('click', () => {
  console.log('监听器 C'); // ← 这行永远不会输出
});

点击按钮后输出：

jm-jsjkxyjs02-zlm-405

使用约定式提交（Conventional Commits）生成标准化的 Git 提交信息。适用于以下场景： (1) 暂存更改时需要提交信息； (2) 审查 diff 时希望获得结构化摘要； (3) 编写 PR 描述或变更日志（changelog）条目； (4) 用户明确要求“为本次更改编写提交信息”。该功能会分析已暂存/未暂存的 diff，并生成按类型（type）划分范围的提交信息。

下载

监听器 A
监听器 B