禁用页面滚动应设置 body 的 overflow: hidden 而非仅拦截 touchmove 事件，因后者在 iOS Safari 等环境不可靠且无法阻止滚轮、方向键等；需配合 height: 100vh 防抖动、空字符串恢复样式，并处理广告层内部滚动及 iframe 限制。
广告弹出时禁止页面滚动，核心是冻结 body 的滚动行为，而不是靠 JS 拦截事件——后者在现代浏览器中既不可靠又影响性能。
为什么不能只用 event.preventDefault() 拦截 touchmove
移动端（尤其是 iOS Safari）对 touchmove 事件的 preventDefault() 有严格限制：若未显式声明 { passive: false }，浏览器会忽略阻止；即使加了，也可能触发“滚动卡顿”或被系统降级为 inert 状态。更关键的是，它无法阻止键盘方向键、鼠标滚轮、或 macOS 触控板惯性滚动等非 touch 途径。实际项目中，90% 的“禁滚动失效”都源于这条路走偏了。
- 必须设
{ passive: false }，否则 Chrome/Firefox 直接静默忽略preventDefault() - iOS Safari 对连续
touchmove阻止敏感，容易触发白屏或布局重排 - 桌面端鼠标滚轮、键盘上下键完全不受该监听影响
body 上设 overflow: hidden 是最稳方案
直接控制滚动容器本身，一劳永逸。但要注意两个硬条件：一是必须作用于 body（不是 html），因为多数浏览器以 body 为默认滚动根；二是要防布局跳动——隐藏滚动条会让视口变宽，导致内容右移。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 推荐写法：
document.body.style.overflow = 'hidden'（打开广告时） - 恢复时别只写
'auto'，用''（空字符串）清空内联样式，避免覆盖外部 CSS - 加
document.body.style.height = '100vh'可防止因滚动条消失引起的高度塌陷或抖动 - 若广告关闭后页面没回到原位置，记得补一句
window.scrollTo(0, scrollY)，其中scrollY是打开前存的值
广告容器自身也要防滚动泄露
如果广告层里有长内容（比如带列表的促销页），而你只锁了 body，用户仍可能在广告内部滚动——这不算 bug，但体验割裂。此时需单独处理广告 DOM：
立即学习“前端免费学习笔记（深入）”；
- 给广告外层元素（如
<div class="ad-modal">）加 <code>overflow-y: auto，并设明确max-height - 绝对不要对广告层设
overflow: hidden，否则里面的内容会被硬裁切，用户看不到完整信息 - 若广告含
iframe（比如第三方广告），它内部滚动无法被父页 CSS 控制，只能靠其自身支持sandbox或与上游协商禁用
真正难的不是“怎么禁”，而是“禁完怎么不露破绽”：滚动条消失后的宽度补偿、iOS 安全区域遮挡、position: fixed 元素在 overflow: hidden 下的渲染异常——这些细节不验证到真机就容易翻车。
