ios 键盘弹起内容点击位置错乱点击失效详解及解决办法

【问题表现】：h5网页在iphone手机上打开，点击input/textarea 键盘弹起的时候，再收起键盘，点击按钮没有反应。滑动一下屏幕，效果就恢复了。

【问题原因】：ios旧系统存在的一个bug(本人版本：12.1.4)，键盘弹起收起的过程中，界面看起来没有什么问题，其实内容的实际dom被留在了键盘撑起的位置

【解决方案】：定位到了原因，也知道了滚动屏幕就能恢复，那就好办了,我们可以在input/textarea失去光标的时候让页面执行一下滚动动作

【技术点】：window.scrollTo(xpos,ypos) 把内容滚动到指定的坐标。

　　　　xpos必需。要在窗口文档显示区左上角显示的文档的 x 坐标。

　　　　ypos必需。要在窗口文档显示区左上角显示的文档的 y 坐标。

vue写法: 

<input type="text" @blur="loseInput" />

methods:{
　　loseInput: function(){
　　　　window.scrollTo(0,0)
　　}
}

jQuery写法:

<input type="text"  class="myInput"/>

$(".myInput").blur(function() {
    window.scrollTo(0, 0);
});

<input type="text"  class="myInput"/>

var myInputObj = document.getElementsByClassName(‘myInput‘)
    //得到一个有序的节点列表 NodeList对象，它有索引 循环它
for(var i=0;i<myInputObj.length;i++){
　　myInputObj[i].onblur=function(){
   　　window.scrollTo(0,0);　　　　　　
   }
}

<input type="text"  id="myInput"/>

var myInputObj = document.getElementById(‘myInput‘)
myInputObj.onblur=function(){
    window.scrollTo(0,0);　　　　　　
} 

ios 键盘弹起内容点击位置错乱点击失效详解及解决办法

原文：https://www.cnblogs.com/liuruikang/p/12939934.html