Bootstrap模态框嵌套时body.modal-open类被提前移除，因默认逻辑未检测剩余显示模态框数量；应监听hidden.bs.modal事件，仅当document.querySelectorAll('.modal.show').length为0时才移除该类，并确保paddingRight还原为空字符串、CSS不覆盖modal-open规则。
body.modal-open类被提前移除
关闭子模态框时，Bootstrap 默认逻辑会检查当前是否有任何 .modal.show 元素，但它的判断方式是直接读 document.body.classList.contains('modal-open') 或监听单个实例的 hidden.bs.modal 后无条件移除——这在多层场景下必然出错。只要还有一个模态框开着，modal-open 就不该丢。
用这个逻辑替代默认行为：
- 监听每个模态框的 hidden.bs.modal 事件
- 查询所有显示中的模态框：document.querySelectorAll('.modal.show').length
- 仅当结果为 0 时，才执行 document.body.classList.remove('modal-open')
- 别用 $('body').removeClass('modal-open')，jQuery 的 DOM 缓存可能不同步
padding-right 没还原或还原错误
Bootstrap 在打开模态框时会往 document.body.style.paddingRight 写一个像素值（比如 "17px"），关闭时需清空该内联样式，让它回退到原始 CSS 值。设成 "0" 或 "auto" 都会导致后续打开时补偿失效、页面“向左跳”。
还原必须严格写成：
- document.body.style.paddingRight = ''（空字符串）
- 不要依赖 removeProperty('padding-right')，IE 和部分旧版 Safari 不支持
- 如果你用了 data-bs-backdrop="static"，它不触发 padding 补偿，那就不需要还原——但得确认没混用其他 modal 实例
第三方滚动库干扰滚动状态检测
像 overlay-scrollbars、scrollbar-width: none 或自定义 scrollbar-gutter 会让 Bootstrap 的 getScrollbarWidth() 返回 0，导致补偿宽度算错，甚至反向注入负值。更糟的是，某些库会劫持 overflow 控制权，使 body.modal-open { overflow: hidden } 完全无效。
排查要点：
- 关闭所有滚动增强插件，看问题是否消失
- 检查 computed style 中 overflow 是否真被设为 hidden，还是被覆盖为 visible
- 若必须共存，绕过 Bootstrap 自动逻辑，自己用 show.bs.modal 和 hidden.bs.modal 手动控制 style.overflow 和 style.paddingRight
自定义 CSS 覆盖了 modal-open 的 overflow 规则
你写的 body { overflow: hidden } 或 body.modal-open { overflow: visible !important } 会直接破坏 Bootstrap 的状态闭环。它不是“没加”，而是加了但被更高优先级规则干掉了。
立即学习“前端免费学习笔记（深入）”；
正确兜底写法只有一条：
- 在全局 CSS 文件末尾（确保加载顺序在 Bootstrap CSS 之后）加入：body.modal-open { overflow: hidden !important; }
- 别给 body 单独设 overflow，也别在 SCSS 里用 @extend 覆盖 .modal-open 相关规则
- 开发者工具里检查 body 元素，确认 overflow: hidden 是从这条规则生效，而不是被划掉
最常被忽略的点：modal-open 不是“开关”，它是状态标记；真正起效的是它触发的样式和 JS 行为链。一旦其中一环断开（比如 padding 还原错、类名被手动删、多层时计数漏判），滚动恢复就不可逆——你看到的“关不回去”，其实是状态已经失联了。
