问题： 

h5页面有个弹框，里面有input输入框，需要用户输入内容。在ios微信中，当第一次输入内容后，发现页面点击不了，点击一些地方出现错位的情况。

解决方案：

在ios微信里面打开h5页面，当遇到input输入框调出软键盘时候。用户输入完成失去焦点，键盘收回后，会发现input输入框的位置发现变化的情况。这里需要监听失焦事件，并重新设定高度才能解决这个问题。

代码如下：

html：

<input type="tel" onblur="iptblur()"/>

js：

function iptblur(){
    var u = navigator.userAgent;
    var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
    if(isiOS) { // 判断是否为IOS系统
	 setTimeout(() => {
           const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
           window.scrollTo(0, Math.max(scrollHeight - 1, 0));
	}, 100);
    }   
}

本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！

链接: https://fly63.com/article/detial/4883