2013-10-26 74 views
0

我刚刚阅读jQuery验证,并遇到了问题。点击提交按钮不会触发任何验证。我一直在寻找几个小时,但不幸的是,我找不到解决方案。我的jQuery验证不工作,因为它应该

我的代码:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
     <title> Test </title> 

     <style> 

       body { 
         max-width: 70em; 
         margin: auto; 
         padding: 0; 
       } 

       .container { 
         max-width: 50%; 
         margin: auto auto; 
         -webkit-border-radius: 5px; 
         -moz-border-radius: 5px; 
         border-radius: 5px; 
       } 

       input, button { 
         display: block; 
         margin: 0.5em auto; 
         height: 2em; 
         width: 90%; 
       } 

       button { 
         border: 0; 
         background-color: green; 
       } 

       .text-center { 
         text-align: center; 
       } 
     </style> 

</head> 

<body> 

     <div class="container"> 
       <form method="POST" id="form"> 
         <h2 class="text-center"> Register! </h2> 
         <label> Username </label> 
         <input type="text" name="username"> 
         <label> Password </label> 
         <input type="password" name="password"> 
         <label> Password Confirmation </label> 
         <input type="password" name="password_confirmation"> 
         <label> Email </label> 
         <input type="password" name="password_confirmation"> 
         <input type="submit" value="Submit"> 
       </form> 
     </div> 

     <script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script> 
     <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.js" type="text/javascript"></script> 

     <script> 

     $(document).ready(function() { 
       $("#form").validate({ 
         rules: { 
           username: { 
             required: true, 
             range: [4, 15] 
           } 

           password: { 
             required: true, 
             minlength: 8 
           } 

           email: { 
             required: true, 
             email: true 
           } 
         } 
       }); 
     }); 



     </script> 
</body> 
</html> 

的jsfiddle:http://jsfiddle.net/hPmec/

+0

你每个对象后忘了逗号... – Terry

+0

你应该看过Java由于缺少逗号而导致控制台日志中的脚本错误。 – Sparky

回答

3

你必须在脚本语法错误

$(document).ready(function() { 
    $("#form").validate({ 
     rules: { 
      username: { 
       required: true, 
       range: [4, 15] 
      }, //missing , 

      password: { 
       required: true, 
       minlength: 8 
      }, //missing , 

      email: { 
       required: true, 
       email: true 
      } 
     } 
    }); 
}); 

演示:Fiddle

相关问题