避免「提交」，當用戶點擊輸入形式只有一個輸入

我正在使用（所有權利，剛開始學習）bootstrap和JavaScript和jQuery。我在其他編程語言方面有相當豐富的經驗，並且我喜歡理解會發生什麼。避免「提交」，當用戶點擊輸入形式只有一個輸入

所以我有一個對話框只包含一個輸入框，我不想在用戶輸入時觸發POST操作。根據我的說法，我正在使用一種骯髒的伎倆，而且我想知道如何更整齊地做到這一點。

<div class="modal-body"> 
    <form enctype="multipart/form-data" class="well"> 
    <input id="empty" name="empty" type="hidden"/></form> 
    <table width="100%"> 
    <tr><td width="30%">accession#.plant#</td> 
     <td><input id="addendum" name="keyword" type="text"/></td></tr> 
    </table> 
</div>

未使用的「空」的形式，它的骯髒把戲我在Firefox 27.0.1

我曾嘗試禁用完全回車鍵，通過回答類似的問題的建議的作品，但它根據我的說法，這有一個不理想的副作用：在輸入元素中輸入數據時，瀏覽器會給出提示。禁用回車鍵使其中難以選擇。

來源

2014-03-04 mariotomo

可能重複：http://stackoverflow.com/a/11235672/716691 – CodeBird

我同意「類似」，而不是「複製」。 – mariotomo

很難說沒有看到JavaScript，但你應該可以在JavaScript中的事件對象上調用preventDefault。這樣可以避免表單提交，但不應該妨礙瀏覽器中的類型提前行爲。

來源

2014-03-04 21:56:55

你可以在http：//cuchubo.wikidot.com/virtual-tour-2 – mariotomo

Give the form an id and then put the id in the keypress function... It should work. 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#[formid]').keypress(function (e) { 
      if (e.which == 13) { 
       e.preventdefault(); 
       return false; 
      } 
     }); 
    }); 
</script>

來源

2014-03-04 22:00:13

看到行動中的事情，這是行不通的。按下回車鍵，表單將被POST-ed。 – mariotomo

您可以使用它，如果沒有輸入字段，它將阻止表單提交。

$(".well").on("submit", function() { 
    var has_empty = false; 
    $(this).find('input').each(function() { 
    if (! $(this).val()) { has_empty = true; return false; } 
    }); 
if (has_empty) { return false; } 
});

編輯：它有所作爲到進入聽者：

$(".well").bind("keyup keypress", function(e) { 
    var code = e.keyCode || e.which; 
    if (code == 13) {    
    e.preventDefault(); 
    var has_empty = false; 
    $(this).find('input').each(function() { 
     if (! $(this).val()) { has_empty = true; return false; } 
    }); 
    if (has_empty) { return false; } 
    } 
});

來源

2014-03-04 22:00:17 sidney

但這是一個巨大的代碼量！我骯髒的伎倆看起來更好，不是嗎？ – mariotomo

如果可行，爲什麼不:)但我不確定您的解決方案是否適用於每個瀏覽器。如果你想要足夠強大的東西，並且哪個地方能夠工作，我建議採用我的解決方案。之間，它確實很長，但這是執行它的客戶端，並且處理時間低得離譜，它不應該是一個問題;） – sidney

避免「提交」，當用戶點擊輸入形式只有一個輸入

回答

相關問題