Input被軟鍵盤遮住

在業務開發過程中，移動端輸入框被軟鍵盤遮住的情況還是很容易出現的。在不同手機不同系統都有可能出現。

網上也有很多解決辦法，比如計算高度然後scroll到某個地方、呼叫scrollintoview，、scrollintoviewifneeded、監聽window的resize方法、定位fixed。方法有很多。

這邊提一下踩過的坑，如果是scrollintoview和scrollintoviewifneeded，在移動端會有不相容的情況。如果是計算scroll，在定位fixed彈窗上滾動不了。這是本人遇見的情況，可能有解決方法，但是沒去研究。

最簡單的方法是使用定位。在聚焦的時候給這個輸入框新增定位fixed，然後設定bottom 0。因為軟鍵盤彈出之後對於可視視窗來說是要扣除軟鍵盤的高度。這個方法很簡單，但是會出現一點小問題，那就是安卓手機使用自帶返回鍵的時候input還是聚焦狀態。

同樣的，也是樣式定位，但是監聽window的resize：

$(window).resize(function() );

因為軟鍵盤彈出之後，可視視窗大小就變了，會觸發resize事件，然後在resize裡面判斷。先判斷當前可視視窗是否小於原來的可視視窗（初始化頁面的時候就初始化乙個原來可視視窗的高度），然後判斷當前input是否是聚焦狀態，

document.getelementbyid(『detail』) == document.activeelement

detail是不希望遮住的input輸入框id。如果兩個條件成立：

$(』.address-detail』).css();

否則：$(』.address-detail』).css();

這個方法簡單是簡單，但是不夠完善，因為我們輸入框在上面的可以不需要去操作什麼，如果有很多歌input需要使用這個方法，那麼就要迴圈去判斷，不過暫時沒遇見很多歌input元素使用的情況，所以沒去研究。