场景
在微信活动页中,页面底部有一块留言区,当输入框获得焦点,软键盘会弹起并将其遮挡
为了避免被遮挡,可以利用JS调整滚动条位置。
测试机型
IPHONE 6 PLUS IOS 9.3.3
魅族 MX5 android 5.1
Window 7 Chrome 58.0.3029.81
代码
// 等软键盘先出现再执行
setTimeout(()=>{
el.scrollTop = el.scrollHeight
},300)
}
问题
在非 IOS 中,可以正常实现滚动到底部。
而 IOS 中,由于当前输入框获取了焦点,导致这种方案不生效。
解决方案
方案一
先让输入框失去焦点,再设置 scrollTop
的值,再获取焦点。
方法二
{
// scrollIntoView 兼容主流移动设备
e.target.scrollIntoView(true)
},300)
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。