H5在ios彈窗狀態下調起輸入法后關閉輸入法頁面元素錯位解決辦法

        最近開發移動端，有個需求：點擊退款彈出文本框和發送短信按鈕，輸入手機號碼和驗證碼確定退款。

        

        發現安卓手機沒毛病，但是在ios手機上點擊文本框調起輸入法，此時點擊完成或者關閉輸入法就無法正常操作了，肉眼看上去頁面沒問題，但實際上頁面元素已經錯位了。

        解決辦法很簡單，就是在app.vue上做一個全局的監聽方法就好了，代碼如下所示：

　　mounted () { // 軟鍵盤關閉事件
  　　document.body.addEventListener('focusout', () => {
    　　   window.scrollTo({ top: 0, left: 0, behavior: 'smooth' })
  　   })
　 }

        以上就是詳細的解決方案，親測有效，希望能幫到大家。

        如需轉載請注明出處：https://www.cnblogs.com/zishang91/p/10954058.html，以便有錯誤可以及時修改，若有錯漏不足之處，請見諒並且指點，謝謝！！！