JavaScript 中怎么阻止键盘按键事件向外冒泡-js教程-PHP中文网

调用 e.stoppropagation() 是阻止键盘事件冒泡的标准方式，需配合 e.preventdefault() 禁用默认行为；旧版 ie 用 e.cancelbubble = true 兼容；addeventlistener 中 return false 无效。

javascript 中怎么阻止键盘按键事件向外冒泡

JavaScript 中阻止键盘按键事件（如 keydown、keyup、keypress）向外冒泡，和阻止点击事件冒泡原理一致，核心是调用事件对象的 stopPropagation() 方法。但要注意：键盘事件默认会冒泡，且多数场景下确实需要拦截，比如在输入框内按回车不希望触发表单提交或页面滚动。

用 stopPropagation() 阻止键盘事件冒泡

这是最标准、推荐的方式。只要在事件处理函数中获取到原生事件对象，调用 e.stopPropagation() 即可中断向父元素传播：

适用于所有现代浏览器（包括 IE9+）
只阻止冒泡，不影响按键本身的默认行为（例如 input 输入、textarea 换行、form 回车提交等）
若还需禁用默认行为（如阻止回车提交表单），要额外调用 e.preventDefault()

示例：

Alibabacloud Sdk Client Initialization For Java

在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。

下载

input.addEventListener('keydown', function(e) {
  if (e.key === 'Enter') {
    e.stopPropagation(); // 阻止冒泡到父容器或 document
    e.preventDefault();  // 阻止表单默认提交
    console.log('回车被拦截，未冒泡');
  }
});

注意兼容性：老版 IE 的 cancelBubble

IE8 及更早版本不支持 stopPropagation()，需用 e.cancelBubble = true。虽然现在基本无需兼容，但若项目仍需支持旧环境，可写兼容函数：

function stopEventBubbling(e) {
  if (e.stopPropagation) {
    e.stopPropagation();
  } else {
    e.cancelBubble = true;
  }
}

input.addEventListener('keydown', function(e) {
  if (e.key === 'Escape') {
    stopEventBubbling(e);
    closeModal();
  }
});