爲什麼驗證不會阻止提交第二個輸入字段的表單？

我有一個表單，當與頁面的不同部分生成輸出提交。所有客戶端。我想驗證表單之前，我嘗試生成輸出：爲什麼驗證不會阻止提交第二個輸入字段的表單？

<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script> 
</head> 
<body> 
    <script language="javascript"> 
     $(document).ready(function() { 
      $("#processForm").validate({ 
       submitHandler: function(form) { 
        $("#output").empty().append($("#numberOne").val()); 
       } 
      }); 
     }); 
    </script> 
    <form id="processForm"> 
     <p><input type="text" id="numberOne" value="37" class="required number"/></p> 
     <p><input type="text" id="numberTwo" value="63" class="required number"/></p> 
     <!--<p><input type="submit" value="Submit"/></p>--> 
     <p><button type="submit">Submit</button></p> 
    </form> 
    <div id="output"></div> 
</body> 
</html>

的numberOne驗證工作正常，並阻止我的代碼被執行，但對於numberTwo它似乎允許submitHandler仍然運行。重現步驟：

打開，按提交，通知37被印刷在其下方提交按鈕
輸入第一場「ASDF」，按提交按鈕，通知37保持低於提交按鈕
輸入「5」在第一個字段中，在第二個字段中輸入「asdf」，按提交按鈕。即使表單無效，「5」也會顯示在「提交」按鈕的下方。

錯誤信息確實顯示，但按下「提交」按鈕時會清除。我錯過了什麼？

我試過input和button標籤。

來源

2012-07-15 earlNameless

嘗試在輸入上使用名稱屬性。通常，如果您正在處理或發送數據，您希望添加名稱屬性。因此，你的投入將是這樣的：

<input type="text" id="numberOne" name="numberOne" value="37" class="required number"/> 
<input type="text" id="numberTwo" name="numberTwo" value="63" class="required number"/>

我創建了一個小提琴，所以你可以確認這是你正在尋找的功能。

http://jsfiddle.net/tokersey/FyjWs/

來源

2012-07-15 04:42:20 tokersey

工作，謝謝。看看驗證器的源代碼（不確定它是如何工作的），他們確實使用name作爲標識符，因此空的空名稱將解釋爲什麼規則僅適用於第一個字段。 – earlNameless 2012-07-15 13:05:46

爲什麼驗證不會阻止提交第二個輸入字段的表單？

回答

相關問題