Bootstrap模态框Esc键不关闭需同时满足三点：根元素必须有tabindex="-1"，backdrop设为"static"禁用背景点击，keyboard设为false禁用键盘；三者缺一不可，否则配置失效。
esc 键不关闭 bootstrap modal，不是 bug，是配置没生效或配置冲突。关键在 keyboard 和 backdrop 必须协同设置，且模态框元素必须有 tabindex。
为什么加了 keyboard: false 还能按 Esc 关闭？
常见原因是 HTML 中的 data-bs-backdrop 或 JS 初始化时的 backdrop 没同步设为 'static'。Bootstrap 5 的行为逻辑是：只要背景可点击（backdrop: true），哪怕 keyboard: false，用户点一下遮罩层就关了——这时你误以为“Esc 没禁掉”，其实是遮罩层抢在 ESC 前响应了关闭动作。
-
keyboard: false只管键盘，不管鼠标 -
backdrop: 'static'才禁用背景点击，二者缺一不可 - 如果用 HTML 属性控制，必须同时写
data-bs-backdrop="static"和data-bs-keyboard="false"；混用 HTML 属性和 JS 初始化容易覆盖，推荐只用 JS 初始化
tabindex="-1" 是 ESC 生效的前提
Bootstrap 5 要求模态框根元素（即 <div class="modal">）必须带 <code>tabindex="-1"，否则 keyboard 配置根本不会被监听——这也是为什么很多人写了 keyboard: false 却发现 Esc 还是能关、或者干脆完全没反应。
- 不加
tabindex：ESC 键事件压根不会冒泡到 modal 实例，配置无效 - 加了
tabindex="-1"后，keyboard: true/false才真正起作用 - 标准结构中它本该存在，但手写 HTML 或动态插入时容易遗漏
如何安全地禁用 Esc + 点击关闭
最稳妥的做法是统一用 JS 初始化，并显式控制状态，避免属性与脚本打架：
const myModalEl = document.getElementById('myModal');
const myModal = new bootstrap.Modal(myModalEl, {
backdrop: 'static',
keyboard: false
});
// 确保 DOM 已就绪且 tabindex 存在
if (!myModalEl.hasAttribute('tabindex')) {
myModalEl.setAttribute('tabindex', '-1');
}
- 不要依赖
data-bs-*属性自动初始化，尤其在 AJAX 加载或组件复用场景下 - 若需手动触发，用
myModal.show()，而非$().modal('show')（避免 jQuery 插件残留） - 连续点击防重：调用
show()前检查myModal._isShown === true或myModalEl.classList.contains('show')
最容易被忽略的是 tabindex 缺失和 backdrop/keyboard 不成对设置。这两个点漏一个，ESC 就可能“时灵时不灵”，调试时建议直接查元素是否同时满足：有 tabindex="-1"、data-bs-backdrop="static"、data-bs-keyboard="false"，再看 JS 初始化是否覆盖了它们。
