正常登錄頁面點擊輸入框獲取焦點后,手機的鍵盤從底部彈出,然后表單應該跟著被頂上去,但是在一些手機自帶的瀏覽器上鍵盤彈出后表單并沒有被頂上去,導致下面的密碼輸入框被鍵盤遮擋了。試過監聽window的resize事件,發現鍵盤彈出后resize事件并未觸發,也就是說頁面的高度沒有變化(innerHeight、clientHeight等等各種Height全試過了),就好像鍵盤是脫離了瀏覽器一樣。然后又嘗試通過獲取焦點來判斷鍵盤彈出,但鍵盤收起就無法判斷,因為如果用戶通過點擊鍵盤右上角的收起按鈕來收起鍵盤,輸入框并不會失去焦點。而收起按鈕又無法捕獲到。想知道前端有什么方法可以解決這個問題。PS:測試的是一加手機,在同一手機的chrome上則正常,表單被頂上去了。測試其他手機時大多數也正常(包括UC),但也有部分手機自帶瀏覽器甚至連chrome都不行。
手機鍵盤彈出遮蓋了表單輸入框
眼眸繁星
2019-02-26 21:18:09