移动端ios兼容input软键盘弹出后页面上移，关闭软键盘页面不自动回弹的问题

1. vue项目开发中，ios端键盘唤起，但关闭键盘后页面还是在上面，不自动回弹。

• 原因分析：
  固定定位的元素 在元素内 input 框聚焦的时候 弹出的软键盘占位 失去焦点的时候软键盘消失 但是还是占位的 导致input框不能再次输入 ，会发现点不动，此时并不是你的页面发生死循环卡死等现象，而是它上移了，没有回复之前的状态。
• 解决办法：

 <input class="contentInput" placeholder="你叫啥"
            v-model="peopleList.name"
           @focus="changefocus()"
           @blur.prevent="changeBlur()"/>  

changeBlur(){
      let u = navigator.userAgent, app = navigator.appVersion;
      let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
      if(isIOS){
        setTimeout(() => {
          const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0
          window.scrollTo(0, Math.max(scrollHeight - 1, 0))
          }, 200)
      }
    }

之后就可以完美解决兼容问题了。

2.一般的移动端页面，如jquery编写的页面

解决办法如下：

$('input').on('blur', function () {
          setTimeout(function(){
            var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
            window.scrollTo(0, Math.max(scrollHeight - 1, 0));
          }, 100);
});

总结

我实际开发中在Android端软键盘关闭之后，input框会回弹，没有问题，但在ios端当时没找到问题，因为在computed定义了多的逻辑还以为卡死了，之后发现是这个问题。然后就完美解决了这个BUG。