jquery.validate通过remote来实现ajax验证范例

jquery.validate可谓是个强大的表单验证插件，当然也完美支持ajax验证，这样可以方便、快速来实现检查用户名等等是否存在。

html/js源码部分：

[html]view plain copy 
    
 <meta charset="utf-8" />  
 <!DOCTYPE html>    
 <html>    
     <head>    
     <title>Submit a form via AJAX</title>    
   
 <script src="js/jquery.min.js"></script>  
   
     <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>  
     <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>  
       
 </head>    
 <body>    
 <form action="" name="infos" id="infos">  
   
     <p>用户名：<input type="text" name="username" id="username" /></p>  
   
     <p><input type="submit" name="sub" /></p>  
   
 </form>  
   
 <script type="text/javascript">  
   
 $(function(){  
     $('#infos').validate({  
         debug:false,  
         onkeyup:false,  
         rules:{  
             username:{  
                 required:true,   
                 remote:{  
                     type:"POST",  
                     url:"01.php", //请求地址  
                     data:{  
                         username:function(){ return $("#username").val(); }  
                     }  
                 }  
             }  
         },  
         messages:{  
             username:{  
                 required:"用户名必填",  
                 remote:"用户名已存在"  
             }  
         },  
         submitHandler:function(form){  
             alert("验证通过");  
         }  
     });  
 });  
   
 </script>  
   
 </body>    
 </html>    
 
   
 
  
 
   
 
  
 
   @RequestMapping(value="/check")
@ResponseBody
public boolean check(HttpServletRequest request) throws Exception{
String code = request.getParameter("code").trim();
System.out.println("code = " + code);
return false;
}
 
  

jquery.validate通过remote来实现ajax验证范例

猜你喜欢