小屏ios页面恢复是光标错位

在移动端开发中,光标错位是个常见问题,尤其在小屏iOS设备上更为突出。当软键盘弹出并挤压页面时,光标位置不正确,即使键盘收起页面恢复,光标依然停留在原始位置,导致页面点击失效。解决办法是在输入框失去焦点时,确保scrollTop回到顶部,以纠正光标位置。
摘要由CSDN通过智能技术生成

移动端页面的定位会影响光标位置,相信很多人都遇到过,然而在整个页面没有用到定位的情况下还是遇到了光标错位的问题。
尤其是小屏的ios手机,原因是移动端在点击input输入的时候软键盘弹出,整个页面被键盘往上挤压,然而光标的位置也被挤压,收起软键盘的时候页面恢复,但是光标还是在原来input的位置,(输入验证码点击发送按钮,键盘会自动收起来,使页面恢复)
就导致光标不在该在的地方,整个页面呈现无法点击的状态,向上点击就会点击到input框,实际上原来input的框并不能点击,
在软键盘收起(也就是失焦)的时候scrollTop回顶部
ps 因为一般情况下有手机号和验证码两个input,如果小屏手机的话,输入完

var telephone = document.querySelector("#telephone");
telephone.onblur 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值