cancel事件无法preventDefault，因其默认行为不可取消；真正可干预的是close事件，需在其中调用showModal()恢复对话框；若需彻底禁用Esc，应监听keydown并阻止传播。
cancel事件不能preventDefault，这是关键前提
浏览器对 cancel 事件的默认行为（按 Esc 关闭 dialog）是不可取消的——调用 e.preventDefault() 完全无效。这不是 bug，而是规范设计：cancel 事件本身没有可阻止的默认动作，它只是通知“用户触发了关闭意图”。试图阻止它，只会让代码看起来在努力，实际毫无作用。
真正要干预的是 close 事件，而不是 cancel
cancel 事件和 close 事件是两个独立阶段：前者表示“请求关闭”，后者表示“已关闭”。你无法拦住请求，但可以在关闭发生后立刻补救。
- 监听
cancel事件，仅用于判断是否由 Esc 触发（e.target === dialog） - 若确认是 Esc 触发，且你不想让它关，就在
close事件里调用dialog.showModal()把它拉回来 - 注意：必须用
showModal()，不是show()；否则焦点不锁、遮罩不生效
阻止 Esc 关闭的最小可行代码
const dialog = document.getElementById('myDialog');
dialog.addEventListener('cancel', (e) => {
// 只有 target 是 dialog 自身，才可能是 Esc 触发（不是子元素冒泡来的）
if (e.target === dialog) {
e.preventDefault(); // 这行其实没用，但留着不报错
}
});
dialog.addEventListener('close', (e) => {
// 检查 returnValue 是否为空（cancel 的典型特征）
if (dialog.returnValue === '') {
dialog.showModal(); // 立即恢复模态状态
}
});
这段逻辑能“视觉上”阻止 Esc 关闭，但本质是关了又立刻重开。如果用户连续猛按 Esc，可能看到闪屏——说明这不是真拦截，而是快速补救。
更稳妥的做法：禁用 Esc 响应本身
如果你真需要彻底禁用 Esc，唯一可靠方式是监听 keydown 并在 dialog 打开时拦截：
立即学习“前端免费学习笔记（深入）”；
- 在
showModal()后添加document.addEventListener('keydown', handleEsc, true) -
handleEsc中检查e.key === 'Escape'且dialog.open为 true - 调用
e.stopImmediatePropagation()，并e.preventDefault() - 别忘了在
close事件里移除该监听，避免内存泄漏
这个方案绕过了 cancel 事件机制，直接截断键盘输入源头。但要注意：它会影响屏幕阅读器用户的 Esc 导航习惯，除非你的场景明确不需要辅助访问支持。
