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

环境:微信浏览器

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

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

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

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

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值