Android鍵盤覆蓋Web表單上的元素

Question

我有一個簡單的HTML表單，輸入元素（文本框）位於頁面的中心。問題出現在移動設備（特別是Android）上時，它覆蓋了其中一些元素。即使我在填寫表單時點擊下一頁，頁面也不會滾動顯示隱藏的元素。有什麼建議麼？是否可以添加一些JavaScript或CSS？

Answer 1

嘗試使用onfocus javascript事件。如果您使用JQuery，則可以使用此示例，如果設備是觸摸屏設備，則將輸入滾動到每個輸入焦點事件的視口頂部。

function isTouchDevice() { 
    try { 
    document.createEvent("TouchEvent"); 
    return true; 
    } catch (e) { 
    return false; 
    } 
} 

$("input").focus(function(){ 
    if(isTouchDevice()){ 
     $('html, body').animate({ 
      scrollTop: $(this).offset().top 
     }, 1000); 
    } 
})