iOS 键盘收起后页面不归位问题如何解决？

Question

iOS 键盘唤起，键盘收起以后页面不归位。

输入内容，软键盘弹出，页面内容整体上移，但是键盘收起，页面内容不下滑。

分析原因可能是固定定位的元素 在元素内 input 框聚焦的时候，弹出的软键盘占位，失去焦点的时候软键盘消失。该如何解决？

Answer 1

我看了你的问题，如果固定定位的元素，在元素内 input 框聚焦的时候，弹出的软键盘占位。
失去焦点的时候软键盘消失，但是还是占位的，导致input框不能再次输入，在失去焦点的时候给一个事件。
解决代码如下：

<div class="list-warp">
  <div class="title"><span>投·被保险人姓名</span></div>
   <div class="content">
     <input class="content-input" 
            placeholder="请输入姓名"
            v-model="peopleList.name"
           @focus="changefocus()"
           @blur.prevent="changeBlur()"/>    </div>
 </div>

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)
      }
    } 

拓展：position: fixed 的元素在 iOS 里，收起键盘的时候会被顶上去，特别是第三方键盘。

Answer 2

监听一下输入框的onblur事件，然后用window.scroll做一下处理