解决ios部分手机键盘弹起导致input无法聚焦的bug

环境:微信浏览器

场景:我们的登录页面,两个输入框,点击获取验证码,弹出一个弹层,弹层采用fixed布局,弹层元素是输入框来输入验证码的

问题:点击弹层input获取焦点后,键盘自动弹起,把页面顶起来了,当点击弹层中处input外区域,键盘自动收起,弹层输入框恢复原位,但是无法聚焦,形成一个bug

测试:测试过程中发现键盘收起后的输入框无法聚焦,但是在之前被键盘顶起来的位置点击居然有效,键盘再次弹起,故猜测时webview的内部scrollview自己实现的键盘弹起上滚页面,但是键盘收起时页面没有回滚,只是因为定位的关系页面虽然还原,但是scrollview没动,导致点击元素还停留在键盘弹起的地方

解决:监听input的blur事件,执行window.scroll(0,0)让页面还原到初始位置

猜你喜欢

转载自blog.csdn.net/THINK_OF_/article/details/84938833