2016-07-09 149 views
0

我正在嘗試使用jQuery驗證程序庫,但無法將消息顯示到DOM中。我讀了類似的問題,但無法找到我的錯誤。未顯示jQuery驗證程序消息

請注意,我還在CSS中添加了.error類。

<html> 
<style> 
    .error{ 
     color: red; 
    } 
</style> 
<main> 
    <div class="registration-mask"> 
     <form name="signup-advertiser" id="signup-form"> 
      <div class="row"><div class="col-sm-4 left"><label for="lastname">Last Name:</label></div> <div class="col-sm-10"><input type="text" name="lastname"></div></div> 
      <div class="row"><div class="col-sm-4 left"><label for="password1">Password:</label></div> <div class="col-sm-10"><input type="password" name="password1"></div></div> 
      <div class="row"><div class="col-sm-4 left"><label for="password">Repeat Password:</label></div> <div class="col-sm-10"><input type="password" name="password"></div></div> 

      <button id="signup-btn">Sign Up!</button> 
     </form> 
    </div> 


</main> 

<!-- jQuery first, then Bootstrap JS. --> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.2/js/bootstrap.min.js" integrity="sha384-vZ2WRJMwsjRMW/8U7i6PWi6AlO1L79snBrmgiDpgIWJ82z8eA5lenwvxbMV1PAh7" crossorigin="anonymous"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.min.js"></script> 
<script> 
    $(document).ready(function() { 

     $('#signup-form').validate({ 
      rules: { 
       lastname: { 
        required: true 
       }, 
       passwrod: { 
        equalTo: password1 
       } 
      }, 
      messages: { 
       lastname: "Please enter your last name", 
       password: "The passwords you entered don't match" 
      } 
     }); 

    }); 
</script> 

</body> 
</html> 

回答

0

密碼的拼寫是錯誤的腳本

passwrod: { 
    equalTo: password1 
} 

給id爲所有輸入元素喜歡跟着那麼它會工作

<input type="text" id="lastname" name="lastname"> 
<input type="password" id="password1" name="password1"> 
<input type="password" id="password" name="password"> 
+0

感謝。我怎樣才能把錯誤消息放在別的地方?不在輸入之下? – ocram

+0

jQuery Validate僅使用'name',** NOT **''id'。 – Sparky