H5 键盘收起 IOS没有重绘问题

场景描述

有一个输入框(input 或者 textarea),IOS 用户唤起键盘输入一串文字后,点击空白区域收起键盘。

问题描述

键盘成功收起,页面回到底部,但是点击提交按钮无反应。

问题原因

键盘收起后,IOS没有进行页面重绘,从视觉上看页面已经回弹到底部,但是逻辑层还停留在上方,所以真正的提交按钮,在所看到按钮的上方(一个看不见的位置)。

解决方案

监听 失去焦点 事件后,手动触发一下页面滑动,就可以触发页面重绘,解决这个鬼畜问题。

onBlur() {
  // 延迟的作用:等待其他事件完成 
  setTimeout(() => {
    const top = document.getElementsByTagName('html')[0].offsetTop
    window.scroll(0, -1 * top)
  }, 500);
}
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容