overscroll-behavior是首选方案，因它直接控制滚动链行为，无需js干预；必须设在html上才对全页生效，none最彻底，contain适用于需保留本层弹性但阻止透传的场景。
为什么 overscroll-behavior 是首选方案
iOS 和 Android 的 WebView（包括微信、QQ、钉钉等 App 内嵌浏览器）默认允许页面内容滚动到底部后继续下拉，触发原生刷新或回弹。禁用它的最直接、标准且无需 JS 干预的方式是使用 CSS 的 overscroll-behavior 属性。
它作用于滚动容器（通常是 html 或 body），告诉浏览器“别把滚到边界的事件透传给外层原生容器”。
-
overscroll-behavior: none同时禁用上下/左右方向的透传（推荐设在html上） -
overscroll-behavior-y: contain也可用，但兼容性略弱于none；contain表示“停住，不透传也不回弹”，而none更彻底 - 必须写在
html元素上才对整个页面生效；只设body在某些 WebView 中无效（尤其是 iOS 15+ 的 WKWebView） - 注意：该属性不影响页面内部可滚动区域（如弹窗里的列表），那些需单独加
overscroll-behavior: contain
如何补全 iOS Safari 和微信 WebView 的兼容处理
部分旧版微信内置浏览器（如 X5 内核 6.8.x）、iOS 12–14 的 Safari 对 overscroll-behavior 支持不完整，此时需配合少量 JS 阻断 touchmove 默认行为。
关键不是阻止所有滚动，而是仅在页面已滚动到顶/底时拦截，否则会破坏正常滚动体验。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 监听
touchmove事件，检查document.scrollingElement.scrollTop === 0 && event.touches[0].clientY > 0（顶部下拉）或scrollTop + clientHeight >= scrollHeight && event.touches[0].clientY （底部上拉） - 满足条件时调用
event.preventDefault()，且需确保passive: false（否则 iOS Safari 会忽略） - 避免绑定在
document上——微信某些版本会因事件冒泡异常导致输入框失焦；推荐绑定在document.body或根容器 - 不要用
position: fixed遮罩层盖住整个页面来防下拉——这会阻断所有交互，且在微信里可能触发白屏
为什么禁止 body 的 overflow: hidden
很多人第一反应是给 body 加 overflow: hidden，但这在多数 App WebView 中完全无效，甚至引发副作用。
- iOS WKWebView 下，
body { overflow: hidden }不影响下拉刷新行为，只可能让页面内容被裁剪 - Android X5 内核中，它有时会让页面无法滚动，或导致
fixed元素错位 - 更严重的是：微信 iOS 版若检测到
body滚动被禁，可能强制启用“双指缩放”或降级渲染模式 - 真正要控制的是“滚动结束后的 overscroll 行为”，不是滚动本身——所以回到
overscroll-behavior才是对症
验证是否生效的三个真实检查点
上线前必须手动在目标环境测试，光看 Chrome DevTools 模拟没用。
- 在微信中打开页面，手指缓慢下拉顶部：应无回弹、无刷新圈动画、URL 地址栏不缩放
- 快速滑动到底部再猛拖——如果看到原生灰色背景或状态栏露出，说明
overscroll-behavior没生效或 JS 拦截漏了 - 打开键盘输入文字后，再尝试下拉：部分 WebView 在软键盘弹出时会重置滚动行为，此时若恢复下拉，说明 JS 绑定未持久化（需在
focus后重新 attach）
真机测试比任何配置都重要。尤其注意微信安卓版和 iOS 版行为差异很大，X5 内核和 WKWebView 对同一段 CSS/JS 的响应可能完全不同。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
