安卓端嵌套h5-键盘遮挡h5底部input且不触发onresize
解决方案:安卓端监听键盘主动触发h5方法
·
出现问题
安卓端键盘弹起后会遮挡底部input,原本通过监听输入框的聚焦和失焦,设置页面高度不同,使input得以显现。但是这样又出现了新的问题:安卓端键盘右上角收起键盘的按钮点击后不会触发失焦,导致页面高度没还原
处理过程
于是谷歌大法,结果发现网络上大部分解决安卓端键盘遮挡底部input的解决方案,是键盘影响页面高度后,监听onresize进行解决。但使用公司的机型尝试后发现安卓端键盘不会影响页面的高度,所以该方案不适用
解决方案
探讨后解决方案如下:
1.h5端在需要监听的页面往window里塞方法
//安卓端输入法弹起的处理方法
window.keyboardUp = () => {
//处理方法,这里改成自己的
}
//安卓端输入法收起的处理方法
window.keyboardDown = () => {
//处理方法,这里改成自己的
}
2.安卓端的同事可以监听安卓端的键盘弹出与收起,然后分别调用h5端window中keyboardUp和keyboardDown这两个方法即可(方法名是自定义的)
更多推荐
已为社区贡献19条内容
所有评论(0)