如何防止鍵盤在iOS應用程序中使用電話區域推高webview

當屏幕底部的輸入字段具有焦點時，鍵盤會向上推動我的webview，頁面的上半部分不再可見。如何防止鍵盤在iOS應用程序中使用電話區域推高webview

我想阻止鍵盤向上推動webview。

任何人有想法？

2012-12-11 Yajap

關注焦點時，設置爲window.scrollTo（0,0）;這樣可以防止鍵盤推高的WebView完全

$('input').on('focus', function(e) { 
    e.preventDefault(); e.stopPropagation(); 
    window.scrollTo(0,0); //the second 0 marks the Y scroll pos. Setting this to i.e. 100 will push the screen up by 100px. 
});

如果不想設置一個靜態值你Ÿ滾動位置，隨意使用這個short plugin I've written that automatically aligns the keyboard underneath the input field。這並不完美，但是它完成了這項工作。如上圖所示，只需撥打這個焦點：

setKeyboardPos(e.target.id);

來源

2012-12-12 02:47:05 Jonathan

它的工作原理！謝謝！！！ – Yajap

它不適用於我的iPad2/iOS6。一個「setTimeout（function（）{windows.scrollTo（0，0）;}，0）」可以修復它，但有時你仍然可以看到一個垃圾抖動動畫。 – Imskull

解決了這個問題，使用 driftyco /離子-插件鍵盤（https://github.com/driftyco/ionic-plugins-keyboard）

首先安裝鍵盤插件：

cordova plugin add com.ionic.keyboard

現在你可以I）要麼禁用原生鍵盤滾動：

cordova.plugins.Keyboard.disableScroll(true);

或II）監聽native.keyboardshow事件deviceready和滾動回頂部時，鍵盤顯示：

window.addEventListener('native.keyboardshow', keyboardShowHandler); 

function keyboardShowHandler(e){ 
    setTimeout(function() { 
     $('html, body').animate({ scrollTop: 0 }, 1000); 
    }, 0); 
}

我用II）的方法，因爲我喜歡的動畫在我的情況下滾動。如果您不想使用動畫進行替換，請使用window.scrollTo(0, 0);替換相應的行。但恐怕在這種情況下，你將再次處理這個「垃圾抖動動畫」Imskull寫道。

來源

2014-09-05 17:52:54 capitannaranja

已採取措施1，按預期工作！ – commonpike

如果使用WKWebView（iOS），則不允許cordova.plugins.Keyboard.disableScroll（true）; ，似乎我會嘗試II），看看會發生什麼。 –

我有同樣的問題，上面的解決方案都沒有幫助我但我找到了一個簡單的方法來通過它。

在平臺/ android文件夾，打開manifest.xml中，並在主要活動標籤取代了android：windowSoftInputMode =「adjustResize」屬性與Android：windowSoftInputMode =「adjustPan」

現在鍵盤將覆蓋你的內容。

我希望它能幫助別人。

來源

2016-11-07 15:21:05

謝謝你爲我節省了很多時間。 – Francesco

清潔和簡單的感謝 –

確保這個在你的config.xml

<preference name="KeyboardShrinksView" value="true" />

來源

2016-11-23 09:10:48

這應該是公認的答案，因爲它解決了問題的正確方式 – pinturic

是否有相當於這個選項的現代日？它似乎不再存在。 – Coo

我真的經歷過100分的答案之前，我必須找到自己的答案。所以這裏是如何禁用IOS上的UI滾動。只需在cordova載入時添加此項。請安裝：

cordova plugin add ionic-plugin-keyboard --save

然後做cordova prepare到您的www文件夾中加載這個新的插件。

document.addEventListener('deviceready', function(e){ 
    window.addEventListener('native.keyboardshow', function() { 
      cordova.plugins.Keyboard.disableScroll(true); 
     }); 
});

就是這樣。請讓我知道這是否有幫助。我會很樂意回答更多。

來源

2018-02-19 09:38:45

如何防止鍵盤在iOS應用程序中使用電話區域推高webview

回答

相關問題