用 window.visualviewport 监听虚拟键盘弹出最可靠，需监听 visualviewport.resize 事件，结合 height 差值与 offsettop 变化判断键盘状态，并用 transform 补偿 fixed 元素位置，聚焦时调用 scrollintoview 兜底。
用 window.visualViewport 监听虚拟键盘弹出，核心是捕获“视觉视口被压缩”这一真实变化，而不是依赖 window.innerHeight 这类易失真的指标。它在 iOS 和现代安卓浏览器中都能稳定触发，是目前最可靠的方案。
监听 resize 事件，而非 window.resize
视觉视口变化不会触发 window.resize，必须直接监听 visualViewport 实例：
- 确保页面加载后立即检查
'visualViewport' in window - 绑定
visualViewport.addEventListener('resize', handler) - 不要在 handler 中同步修改
top或bottom，避免强制重排
用 height 差值 + offsetTop 组合判断键盘状态
单看高度容易误判（比如小屏设备本身 height 就小），需结合初始基准与偏移量：
- 页面就绪后延迟 300ms 采样一次
visualViewport.height作为 baseline - iOS 键盘弹出时
offsetTop明显增大（视觉区域上移），而安卓多表现为height显著减小 - 当
currentHeight 且 <code>currentOffsetTop > baselineOffsetTop + 20，可判定为键盘弹出
动态修正 fixed 元素位置，优先用 transform
底部按钮被顶出，本质是它仍锚定在布局视口底边，而用户看到的“底边”已上移：
- 获取当前
visualViewport.offsetTop，即页面被推高的像素值 - 对目标元素设置
style.transform = `translateY(-${offsetTop}px)` - 键盘收起时还原为
translateY(0)，避免位移残留 - 只作用于真正需要“贴视觉底边”的元素，如提交栏、输入工具条
兜底：聚焦时滚动输入框到可视区域
即使做了 transform 补偿，某些嵌套滚动容器内输入框仍可能被遮挡：
- 在
focusin事件中缓存当前document.activeElement - 键盘确认弹出后，调用
activeInput.scrollIntoView({ block: 'nearest', inline: 'start' }) - 禁用
behavior: 'smooth'，防止与系统键盘动画冲突抖动 - 确保父容器有
overflow-y: auto且高度未被height: 100vh锁死
大量免费API接口：立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游，为数据API应用能力赋能！
