Android和HTML5號碼輸入自動提交行爲

我正在編寫一個網頁，其中包含用於估算運費和稅金的單個郵政編碼字段。一旦用戶點擊數字鍵盤上的回車鍵，我希望表單提交。Android和HTML5號碼輸入自動提交行爲

例如

<form method="GET"> 
    <input type="hidden" id="ProductCode" value="12345" /> 
    Enter zip: <input type="number" id="ZipCode" /> 
</form>

當前的行爲顯然不是明顯不夠：

<script> 
$(document).ready(function() { 
    $('#ZipCode').keyup(function() { 
     if($(this).val().length == 5) { 
      $(this).closest('form').submit(); 
     } 
    }); 
    $('#ZipCode').focus(function() { 
     $(this).val(''); 
    }); 
}); 
</script>

我非常希望的形式自動提交當回車鍵被關閉或（如果可能）當軟鍵盤被關閉用戶。有什麼辦法可以在Android瀏覽器中使用JavaScript嗎？

來源

2011-10-28 Kris Oye

您可以嘗試添加隱藏按鈕。這至少在Chrome中起作用。當表單有一個提交按鈕時，它會在按下輸入時自動觸發。

<form method="GET"> 
    <input type="hidden" id="ProductCode" value="12345" /> 
    Enter zip: <input type="number" id="ZipCode" /> 
    <button type="submit" style="display:none"> 
</form>

您可以使用$("form").submit(function(){ // run when form is submitted })來實現提交代碼。

來源

2011-10-28 22:18:32 Lycha

我遇到的問題是在輸入數字鍵盤時輸入submit（）不會觸發我的測試設備。當我嘗試捕獲onKeyPress，onKeyUp，onKeyDown事件處理程序中的掃描代碼時，Enter鍵甚至沒有註冊。所有的輸入鍵似乎都在我的設備上（Galaxy S II）關閉了數字鍵盤。我已經嘗試了上面的兩個實現，但沒有任何行爲改變。我幾乎不知道它是否是UI覆蓋... –

@KrisOye我明白你的意思了。我知道android「enter」鍵是一個古怪的東西，並沒有註冊到事件處理程序，但我認爲它至少會提交一個按鈕的形式（硬件和軟件鍵盤）。在我的腦海裏沒有任何其他解決方案。 – Lycha

將提交按鈕放在窗體中，回車鍵自然會提交表單。

<form method="GET"> 
    <input type="hidden" id="ProductCode" value="12345" /> 
    Enter zip: <input type="number" id="ZipCode" /> 
    <input type="submit" value="submit" style="visibility: hidden" /> 
</form>

如果您需要驗證綁定到表單提交事件，並在那裏執行必要的驗證。

$('form').submit(function() { 
    var invalid = $('#ZipCode').val().length !== 5; 
    if(invalid) 
     return false 
});

來源

2011-10-28 22:18:49

Android和HTML5號碼輸入自動提交行爲

回答

相關問題