科爾多瓦/ Phonegap 3.1鍵盤（仍然）覆蓋重點形式領域 - iOS 7

嗨，大家好，我剛剛從科爾多瓦3.0升級到3.1，我仍然遇到一個非常令人不安的問題（在使用KeyboardShrinksView首選項時仍然存在）。科爾多瓦/ Phonegap 3.1鍵盤（仍然）覆蓋重點形式領域 - iOS 7

每當我關注一個觸發鍵盤打開的元素（input/textarea），元素就會隱藏在鍵盤後面，我需要按順序向下滾動（使用webkit-overflow-scrolling進行滾動）查看元素及其內容。

當KeyboardShrinksView設置爲true時，頁面將不會滾動，甚至會變得更糟。

任何解決方案，以解決這個問題？我看過幾個問題和錯誤報告，但沒有工作解決方案（或者解決方案）。

使用「全屏」選項無法解決問題。

感謝您的幫助

來源

2013-10-08 Alex

看看[這個答案]（http://stackoverflow.com/a/18991076/503545）。它爲我修好了。 – tkh44

很好的回答！感謝分享，它自動完成鍵盤的工作，但不幸的是我的固定頭部被隱藏了（它不再被修復，並且與視圖一起滾動）。這部分的任何解決方案？乾杯 – Alex

最後固定以下插件的幫助下，問題：jQuery scrollTo plugin

每當我針對元素我正在觸發它執行以下計算並更新滾動位置的焦點事件：

updateScroll: function(e){ 
    var el = $(e.currentTarget); 
    var offset = -$(".scrollerWrap").height() + $(el).height(); 
    $(".scrollerWrap").scrollTo(el,{offset: offset}); 
}

將輸入/文本區的底部粘到鍵盤的頂部。像魅力一樣工作，即使解決方案需要經歷這一點JavaScript。

來源

2013-10-08 12:36:53 Alex

嗯，我沒有親自嘗試過，但在某處閱讀scrollTo在iOS7中不能與safari一起使用。 –

完美適合我:) – Alex

@Alex：請提供一些關於如何使用它的更多細節？ –

好，邏輯上鍵盤打開時認爲應該向上移動。我遇到了與iOS7類似的問題，並解決它我已經應用了幾個CSS的調整。

調整應用於包含應用程序內容的包裝類/ id。

position: relative; 
overflow: hidden; 
height: 460px; 
width: 320px;

注 - 高度和寬度被動態地判斷取決於裝置的高度和寬度

height = window.innerHeight 
width = window.innerWidth

通過使用jQuery選擇高度和寬度被附加到包裝類/ ID。

來源

2013-10-08 05:31:19

感謝您的幫助。我檢查了我的包裝類的高度，它是否正在改變鍵盤是否顯示，但內容沒有「滾動」到焦點輸入/文本區域，因此不得不自動滾動以查看它。我仍然在javascript中測試一些其他的東西，我會讓你知道結果。 – Alex

剛剛有一個非常類似的問題。在這個網站上發現的一些黑客確實有效，但有令人討厭的副作用（比如弄亂了滾動或CSS佈局）。最後想出了一個全新的愚蠢黑客。

視窗meta標籤：

<meta name="viewport" content="initial-scale=1, maximum-scale=1, width=device-width" />

的JavaScript加載後運行：

document.body.style.height = screen.availHeight + 'px';

就是這樣。在iOS 7上工作，我有不知道爲什麼。

來源

2014-01-23 18:18:26 andypaxo

這對我來說非常合適我在使用鍵盤時遇到了其他問題，需要我在視口meta中設置「height = device-height」，從而導致身高（100％）我將你的代碼和代碼結合在一起：https：//gist.github.com/shazron/6602131，並且所有的代碼都運行得很順利 –

這是天才，我不知道它爲什麼可以工作，但我真的有用！謝謝！ – howard10

適合我。

document.body.style.height = (screen.availHeight - 100) + 'px';

來源

2015-06-23 23:44:07

我認爲這裏的問題來自Framework7。

document.body.style.height = window.outerHeight + 'px';

放置在我的index.js文件中的上述代碼的工作方式與魅力類似。

來源

2017-12-24 17:28:38

科爾多瓦/ Phonegap 3.1鍵盤（仍然）覆蓋重點形式領域 - iOS 7

回答

相關問題