共计 557 个字符,预计需要花费 2 分钟才能阅读完成。
在 iOS12 之后,h5 的 input 框失焦后页面会出现被顶上去一部分的 bug, 下面就来看下怎么解决这个 bug,首先我们必须知道这两个方法 focusin(软键盘弹起事件)、focusout(软键盘关闭事件)。
废话不多说,直接上代码 // 解决 iOS 软键盘弹起把页面顶起来一部分的 bug
var u = navigator.userAgent;
var flag;
var myFunction;
var isIOS = !!u.match(/\(i[^;]+;(U;)? CPU.+Mac OS X/);
if(isIOS){
document.body.addEventListener(‘focusin’, () => {// 软键盘弹起事件
flag=true;
clearTimeout(myFunction);
})
document.body.addEventListener(‘focusout’, () => {// 软键盘关闭事件
flag=false;
if(!flag){
myFunction = setTimeout(function(){
window.scrollTo({top:0,left:0,behavior:”smooth”})// 重点 ======= 当键盘收起的时候让页面回到原始位置
},200);
}else{
return
}
})
}else{
return
}
正文完
发表至: javascript
2019-01-21