问题描述:input框在页面中下位置时:点击输入框时ios系统输入法将浏览器整个推上去,完成输入后浏览器还处在被输入法推上去的状态,需要用户手动下拉将网页还原成正常状态。
解决方法:选择所有的input框,对其添加 focus 和 blur 事件监听, focus 事件触发后给该单页面添加 "paddingBottom",blur 事件触发时重置样式,可以自动让浏览器重置为正常状态。
let that = this;
// 解决ios输入框将网页顶起导致其他元素脱离dom流问题
document.querySelectorAll("input").forEach(element => {
element.addEventListener("focus", function() {
that.$refs.pagebox.style.paddingBottom = "1px";
})
element.addEventListener("blur", function() {
that.$refs.pagebox.style.paddingBottom = "0";
})
})