h5嵌在一个iOS版的app里,软件盘收起后,页面无法回到原位置下面有空白
<input type="number" placeholder="手机号码" v-model="mobile" @blur="blurAdjust" />
方法一、
blurAdjust () {
window.scroll(0, 0)
window.body.scroll(0, 0)
},
方法二、
blurAdjust () {
// 将滚动拉到底
setTimeout(() => {
let scrollHeight =
document.documentElement.scrollTop || document.body.scrollTop || 0
window.scrollTo(0, Math.max(scrollHeight - 1, 0))
}, 100)
},
方法三、
blurAdjust () {
document.body.scrollTop = 0
document.documentElement.scrollTop = 0
},
方法四、
created () {
this.goDown()
},
methods: {
goDown () {
window.scroll(0, 0)
document.body.addEventListener('focusout', () => {
setTimeout(function () {
let scrollHeight =
document.documentElement.scrollTop || document.body.scrollTop || 0
window.scrollTo(0, Math.max(scrollHeight - 1, 0))
}, 100)
})
}
}
方法五、直接放在App.vue里或者index.html里
<script type="text/javascript">
document.body.addEventListener("focusout", () => {
setTimeout(() => {
const scrollHeight =
document.documentElement.scrollTop || document.body.scrollTop || 0;
window.scrollTo(0, Math.max(scrollHeight - 1, 0));
}, 100);
});
</script>
以上五种方法都尝试过了,这几种方法完全可以解决h5页面在微信里软键盘弹出页面无法回落的问题。
在微信或这浏览器里遇到软件盘收起的小伙伴们,可以参考上面方法。
我之前如果尝试了以上所有方法都没有作用:纠结惆怅了许久,后来发现是合作方app的问题。
总而言之:解决这个死愁人的bug,好开心!😄😄😄😄😄😄😄😄😄😄希望你帮到困惑中的你👉