用jQuery表單驗證掙扎

我正在創建一個非常簡單的只有兩個輸入和提交按鈕的註冊表單。
我遇到的問題是它只會完成一個if語句。用jQuery表單驗證掙扎

這裏是jQuery的我做：

$("#usernameError").hide(); 
$("#passwordError").hide(); 

$("#registrationSubmit").click(function(){ 

    if($("#username").val() == ""){ 

    $("#usernameError").show(); 
    return false; 
    } 

    if($("#passwordReg").val() == ""){ 

    $("#passwordError").show(); 
    return false; 
    } 
});

這裏是HTML使用引導：

<div class="modal fade" id="add-admin-modal"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header admin"> 
     Please Enter Details 
     </div> 
     <div class="modal-body admin"> 
     <form id="registrationForm" action="registerAction.php" method="post"> 
      <div class="form-group"> 
      <label for="">Username</label> 
      <input name="username" type="username" class="form-control" id="username" aria-describedby="emailHelp" placeholder="Enter Username"> 
      <div id="usernameError" class="alert alert-danger pad" role="alert">A Username is required!</div> 
      </div> 
      <div class="form-group"> 
      <label for="password">Password</label> 
      <input name="password" type="password" class="form-control" id="passwordReg" placeholder="Password"> 
      <div id="passwordError" class="alert alert-danger pad" role="alert">A Password is required!</div> 
      </div> 

      <div class="form-group"> 
      <button type="submit" id="registrationSubmit" name="registrationSubmit" class="btn btn-success">Ok</button> 
      <button class="btn btn-default" data-dismiss="modal">Cancel</button> 
      </div> 
     </form> 
     </div> 
    </div> 
    </div> 
</div> 
<script src="validations.js"></script>

該腳本將驗證用戶名和顯示錯誤，但不會做任何事情與密碼。

是否因爲我使用return false來阻止提交表單？
我能用什麼來代替？

來源

2017-07-14 Zac Charles

我不明白爲什麼你接受了這個建議刪除回報的答案......這段代碼工作正常。 'return false;'沒有問題。看到這個[** CodePen **]（https://codepen.io/Bes7weB/pen/vZPrjx?editors=1011），因爲演示是在Codepen上的，所以我阻止提交。 ---我會向那些'if'建議一個'else'部分，以刪除錯誤消息......這是唯一的。 ---實際上，刪除返回也會消除驗證效果。即使存在空字段，表單也會提交。 –

提交您的表單與兩個輸入爲空，它只會出現用戶名錯誤，而不是兩個。我遇到的問題是如果兩者都需要顯示，則顯示兩者。 –

關於jQuery Validate插件的問題絕對沒有。標記時請小心。編輯。 – Sparky

是的，就是這樣，刪除return語句。您可以使用布爾變量errorOccurred，並在出現錯誤時將其設置爲true。某個地方你有一個發佈功能，如果發生錯誤，它不會發布數據。

來源

2017-07-14 21:44:03

非常感謝！解決它，如果errorOccured設置爲true，則返回false！我第一次使用堆棧來解決問題（只需要編碼幾周），並且會再次執行！再次感謝！ –

沒問題。如果解決了它，請接受答案。 –

您退出代碼。不要這樣做，如果你想執行代碼後

var ValidationFailed = false; 

if($("#username").val() == ""){ 

    $("#usernameError").show(); 
    ValidationFailed = true; 
} 

if($("#passwordReg").val() == ""){ 

    $("#passwordError").show(); 
    ValidationFailed = true; 

} 
//..... 

return ValidationFailed;

來源

2017-07-14 21:48:55 lloyd

用jQuery表單驗證掙扎

回答

相關問題