移動端軟體盤遮擋輸入框問題

2022-03-30 22:59:36 字數 781 閱讀 9296

一、首先解決軟鍵盤影響布局的問題:

軟鍵盤彈出會改變瀏覽器可視區域的高度,安卓會觸發window.resize事件,ios不會觸發,所以如果頁面元素的布局是以視窗大小為基準的話,會出現布局混亂;比如body的height:100%等等,

所以需要在頁面初始化完成後執行這段**(固定body的高度,不讓他自適應)

$(document).ready(function() );

第二、區分輸入框被遮擋的型別

輸入框的高度目測最高是頁面可視區域的一半,即1/2手機螢幕寬度,所以如果所有輸入框都在頁面上半部分,就不存在軟鍵盤遮擋輸入框的問題

(1)、輸入框在頁面的底部且第乙個輸入框在頁面下半部分

輸入框組用絕對定位定位到頁面底部。當軟鍵盤彈出時也就自動把所有的輸入框彈上去

(2)、輸入框組的總高度大於1/2頁面高度

給每個輸入框做focuse監聽事件或者直接監聽window.resize事件(如果使用的是第三方輸入法的話,需要把下面的**放到時間函式內部)

document.activeelement.scrollintoview(false);

document.activeelement.scrollintoviewifneeded();

或者

function scrollt(), 300);

參考**:

深入理解滾動scroll:

鍵盤遮擋輸入框

1 將輸入框的 設定為self 在lb檔案中將輸入框的delegate設定為file s owner 或者使用 textfield.delegate self 2 將輸入框所對應的viewcontroller.h設定實現了uitextfielddelegate協議 在viewcontroller.m...

解決鍵盤遮擋輸入框問題

void viewdidload 如果輸入框被擋住 那麼將 self.view上移 先要獲取到鍵盤的 frame,才能得知輸入框是否被擋住 通過新增觀察者 來拿到鍵盤的 frame 監聽鍵盤抬起事件.uikeyboardwillshownotification 系統封裝的事件 nsnotificat...

iOS解決鍵盤遮擋輸入框問題

一 彈出鍵盤時,將整個檢視上移 監聽鍵盤事件 監聽鍵盤 1 鍵盤彈出時 nsnotificationcenter defaultcenter addobserver self selector selector keyboardwillshow name uikeyboardwillshownoti...