今天在做一個H5的網(wǎng)頁頁面，需求是在微信里面打開正常，頁面上有個表單輸入框，同事手機(jī)蘋果6P出現(xiàn)了一個問題：鍵盤喚起再關(guān)閉的時候下面有一片空白。而蘋果8 沒出現(xiàn)，經(jīng)查閱和測試發(fā)現(xiàn)跟系統(tǒng)有關(guān)：

蘋果以往的系統(tǒng)是沒問題的，一般情況下，點(diǎn)擊input喚起鍵盤后是會自動顯示到輸入框的地方，然后收起鍵盤頁面就會恢復(fù)到底部。

?但是如果蘋果是已經(jīng)更新到最新的IOS12的話就會發(fā)生一個BUG，就是鍵盤喚起后把頁面頂上去，然后把鍵盤收回去后頁面卻回不來了，保持著被頂起的狀態(tài)，原本鍵盤的地方留出一塊空白。

解決BUG方法：

解決方法就是在input失去焦點(diǎn)的時候（就是收起鍵盤時）讓頁面滾動到頂部。

適用：微信H5/移動端頁面

let ua = window.navigator.userAgent;

? ? let app = window.navigator.appVersion;

? ? //$alert('瀏覽器版本: ' + app + '\n' + '用戶代理: ' + ua);

? ? if(!!ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)){

? ? ? ? //$alert('ios端');

? ? ? ? $("input").on("blur",function () {

? ? ? ? ? ? var currentPosition,timer;

? ? ? ? ? ? var speed=1;

? ? ? ? ? ? timer=setInterval(function(){

? ? ? ? ? ? ? ? currentPosition=document.documentElement.scrollTop || document.body.scrollTop;

? ? ? ? ? ? ? ? currentPosition-=speed;

? ? ? ? ? ? ? ? window.scrollTo(0,currentPosition);//頁面向上滾動

? ? ? ? ? ? ? ? currentPosition+=speed;

? ? ? ? ? ? ? ? window.scrollTo(0,currentPosition);//頁面向下滾動

? ? ? ? ? ? ? ? clearInterval(timer);

? ? ? ? ? ? },100);

? ? ? ? })

? ? }else if(ua.indexOf('Android') > -1 || ua.indexOf('Adr') > -1) {

? ? ? ? //$alert('android端');

? ? }