我遇到的問題:在微信瀏覽器裏,點擊蒙層的input框,彈出軟鍵盤,蒙層被頂上去,同時input的焦點和button的點擊事件也被頂上去了,軟鍵盤消失,蒙層回到原位,可是點擊input和button均沒反應,點擊蒙層被頂上去的位置有反應,由於input的焦點和button的點擊事件沒回到原位。這個問題出如今ios中,android手機沒問題。android
如下是一位大佬寫的解決方法,解決了個人問題。ios
原文地址:https://blog.csdn.net/Doubleu_/article/details/86596569瀏覽器
緣由:移動端頁面的定位會影響光標位置。移動端在點擊input輸入的時候軟鍵盤彈出,整個頁面被鍵盤往上擠壓,然而光標的位置也被擠壓,收起軟鍵盤的時候頁面恢復,可是光標仍是在原來input的位置,就致使光標不在該在的地方,整個頁面呈現沒法點擊的狀態,用戶體驗極差。微信
解決方法:spa
方法一:在軟鍵盤收起(也就是失焦)的時候scrollTop回頂部,或者使用window.reload()。.net
$("input").blur(function(){ setTimeout(function(){ var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0; window.scrollTo(0, Math.max(scrollHeight - 1, 0)); },100) })
方法二:使用reloadcode
$('textarea,input[type=text]').focus(function () { window.setTimeout('scrollBottom()', 500); }); function scrollBottom() { window.scrollTo(0, $('body').height()); }