微信IOS6.7.4版本在输入框弹出键盘后，页面没恢复

81 阅读 0 评论 54 点赞

我是靠谱客的博主傲娇冷风，这篇文章主要介绍微信IOS6.7.4版本在输入框弹出键盘后，页面没恢复，现在分享给大家，希望可以做个参考。

ios中，键盘的弹起，页面会往上挪动，使输入框展示在页面中间，键盘隐藏页面会下挪恢复原状

在6.7.4版本中，不会回挪，这将导致有相对定位（fixed,absolute:相对于浏览器窗体）的节点发生位移，导致节点点击事件偏移而无法选中

解决方案：输入框失去焦点（即键盘隐藏时），手动调整页面，document.activeElement.scrollIntoViewIfNeeded(true)

在每个输入框失去焦点时，响应以下事件即可

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function blurAdjust( e ){
	setTimeout(()=>{
		if(document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA'){
			return
		}

		let result = 'pc';
	    if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { //判断iPhone|iPad|iPod|iOS
	        result = 'ios'
	    }else if(/(Android)/i.test(navigator.userAgent)) {  //判断Android
	        result = 'android'
	    }

	    if( result = 'ios' ){
			document.activeElement.scrollIntoViewIfNeeded(true);
	    }
	},400)
}