全屏布局下输入框被键盘盖住的根本原因是浏览器未自动滚动，而非height: 100vh错误；必须在input/textarea的focus事件中调用scrollIntoView({ block: 'nearest', inline: 'nearest' })，并确保viewport包含height=device-height且禁用user-scalable=no，否则JS无法感知键盘弹出。
focus事件里调scrollIntoView({ block: 'nearest', inline: 'nearest' })才有效
全屏布局下输入框被键盘盖住，不是因为height: 100vh写错了，而是浏览器根本没帮你滚动——iOS Safari在focus触发时就已准备好键盘，但页面还卡在原位置。必须在这个瞬间干预。
- 监听
input或textarea自身的focus事件，不是click或touchstart（时机太早，DOM还没真正聚焦） - 直接调
element.scrollIntoView({ block: 'nearest', inline: 'nearest' })，不加behavior: 'smooth'（老版微信X5内核会静默失败） - 别用
scrollIntoViewIfNeeded()——Android WebView里基本不支持，容易白执行 - 如果输入框在
position: fixed容器里，确保父容器overflow: visible，否则滚动会被截断
viewport meta标签写错，JS就完全失效
90%的“滚动没反应”问题，根源是<meta name="viewport">锁死了浏览器对键盘弹出的感知能力。iOS一旦被禁用viewport重绘，visualViewport.height永远等于屏幕高度，JS压根不知道键盘起来了。
- 必须包含
height=device-height：否则iOS Safari的window.innerHeight在键盘弹出后不变，无法判断遮挡 - 绝对禁用
user-scalable=no：它会让iOS静默忽略键盘弹出时的viewport重绘，比不写还危险 - 推荐写法：
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=yes, height=device-height"> - Android Chrome对
height=device-height支持弱，但至少不会破坏逻辑；别用viewport-fit=cover单独撑开——它不解决滚动问题
安卓WebView里scrollIntoView常失效，得换resize+延迟
安卓Chrome和WebView在软键盘弹出前就发了focus，此时window.innerHeight还是原始值，scrollIntoView()滚的是“键盘还没出来”的位置，结果滚完键盘一弹，又盖住了。
- 改监听
window的resize事件，更可靠（键盘弹出会触发） - 必须加
setTimeout，至少100ms，低端机可能要400–600ms - 用
document.activeElement.getBoundingClientRect()动态判断是否真被遮挡：rect.bottom > window.innerHeight才滚动 - 别依赖
document.body.scrollTop——安卓下基本为0，统一用document.documentElement.scrollTop或直接操作元素
blur时不处理，页面就悬在半空
focus时滚上去了，blur时不恢复，用户再点别的输入框，光标可能直接消失——尤其iOS收起键盘后页面不自动回滚，留白+错位是常态。
立即学习“前端免费学习笔记（深入）”；
- 监听
blur事件，配合防抖（比如200ms），再调一次window.scrollTo(0, lastScrollTop) -
lastScrollTop要在focus前一刻取：const lastScrollTop = window.visualViewport?.pageTop || window.pageYOffset - 别用
window.scroll(0, 0)硬滚回顶部，会打断用户浏览上下文 - 如果底部有
position: fixed输入框+遮罩层，blur时得临时把遮罩层position切回fixed并重置bottom: 0
scrollIntoView()在display: none或visibility: hidden状态下根本不会生效——动态显示输入框后，必须等reflow完成再focus，否则滚动逻辑直接跳过。 
