Android上的Phonegap：使用鍵盤時的佈局滾動

我剛開始創建一個Maqetta for Android和WindowsPhone手機應用程序的移動應用程序。該應用程序包含一些帶有文本輸入的網頁，因此我需要軟鍵盤才能工作。Android上的Phonegap：使用鍵盤時的佈局滾動

我的問題是鍵盤在兩個操作系統上的反應完全不同。在windows手機上，當我點擊一個文本框時，鍵盤顯示並覆蓋了它下面的所有東西。要訪問其他文本框，我仍然可以在顯示我的網站並選擇它的字段中滾動。另外，這對我來說非常重要，網站沒有壓縮。這正是我想要的。

在Android上，事情有點複雜。做了很多的研究後，我偶然發現了這些傢伙：

機器人：windowSoftInputMode =「adjustResize」和機器人：windowSoftInputMode =「adjustPan」

我曾經嘗試都，但兩者不適合我的需要。 adjustRezise壓縮我的網站（因爲網站的高度爲100％），並且adjustPan覆蓋它下面的所有內容，但沒有任何可能達到它（除了關閉鍵盤併爲每個文本框重新打開它//並且必須鍵入而不會看到您鍵入的內容）。

我也聽說過ScrollViews和類似的東西，但由於我是這個主題的新手，我不知道這是什麼，以及如何使用它，因爲我專注於HTML和CSS部分應用程序，所以如果你有任何提示，請記住，它可能需要一些信息讓我理解。 ;）

如果你們其中一人可以幫我解決這個問題，我會很高興。我希望有一個解決方案。

來源

2013-07-23 user2610344

對於大家，有同樣的問題：經過一些研究，我發現這似乎是一個與Android的問題。我必須讓我的HTML站點高出150％，並在鍵盤打開時滾動到某個位置。這不是一個很好的方法，而且令人失望的是沒有別的辦法，但至少是有效的。 – user2610344

安裝高度：150％不適合我。即使沒有足夠的內容滾動，它也可以使頁面滾動。以下解決方案（CSS混合的Javascript &的）工作過：

在CSS：我一直在應用程序/ HTML的高度：100％;並溢出-y：auto;
```
#container { 
    height: 100%; 
    overflow-y: auto; 
} 
```

檢測聚焦的textarea或輸入，然後等待一段時間，直到顯示鍵盤，最後滾動頁面才能達到重點投入。

$("#textarea").focus(function(e) { 
    var container = $('#container'), 
    scrollTo = $('#textarea'); 

    setTimeout((function() { 
     container.animate({ 
     scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop() 
     }); 
    }), 500); 

});

當鍵盤被隱藏在文本區不斷集中，因此，如果我們再次點擊鍵盤將顯示和容器需要再次滾動顯示輸入

$("#textarea").click(function(e) { 
    e.stopPropagation(); 
    var container = $('#container'), //container element to be scrolled, contains input 
    scrollTo = $('#textarea'); 

    setTimeout((function() { 
     container.animate({ 
     scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop() 
     }); 
    }), 500); 
});

來源

2015-10-06 17:15:30

Android上的Phonegap：使用鍵盤時的佈局滾動

回答

相關問題