Jquery表单验证插件–Validform

Validform:

Jquery表单验证插件–Validform：一行代码搞定整站的表单验证！

Validform 官网

Html代码  

1. <script src="/js/jquery-1.8.1.min.js"></script>  
2. <script type="text/javascript" src="/js/Validform_v5.3.2_min.js"></script>  
3. <script src="/js/jquery.form.js"></script>  
4.   
5. <form action="/union/saveJoin.do" method="post" id="form1" class="registerform">  
6.     <table border="0" cellpadding="0" cellspacing="1" width="800" >     
7.         <tr>  
8.             <td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 姓名 </td>  
9.             <td width="600" valign="middle"><input class="shout" type="text" name="username" id="username" datatype="s2-12" errormsg="姓名至少2个字符,最多12个字符！" nullmsg="请填写姓名！" ></td>  
10.         </tr>  
11.         <tr>  
12.             <td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 手机 </td>  
13.             <td width="600" valign="middle"><input class="shout" type="text" name="mobile" id="mobile" datatype="m" errormsg="手机号码格式不正确！" nullmsg="请填写手机号码！"></td>  
14.         </tr>  
15.         <tr>  
16.             <td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 邮箱 </td>  
17.             <td width="600" valign="middle"><input type="text" name="email" id="email" datatype="e" errormsg="邮箱格式不正确！" nullmsg="请填写邮箱！"></td>  
18.         </tr>  
19.         <tr>  
20.             <td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 身份证号 </td>  
21.             <td width="600" valign="middle"><input type="text" name="idcard" id="idcard" datatype="*"  nullmsg="请填写身份证号！"></td>  
22.         </tr>                       
23.           
24.         <tr>  
25.             <td width="200" height="60" align="right" valign="middle" style="padding-right: 20px;"> </td>  
26.             <td width="600" valign="middle">  
27.                 <input class="btn" type="submit" value="提交资料">  
28.             </td>  
29.         </tr>  
30.     </table>  
31.     <span id="checkButton"></span>  
32. </form>  

 

JS :

Js代码  

1. $(function() {  
2.     $(".registerform").Validform({  
3.         btnSubmit:"#checkButton",  
4.         tiptype:function(msg){  
5.             if(msg != ''){  
6.                 showmsg(msg);  
7.             }  
8.         },  
9.         tipSweep:true,  
10.         beforeSubmit:function(){  
11.             saveAccount();  
12.             return false;  
13.         }  
14.     });  
15. });  
16.   
17. function saveAccount(){  
18.       
19.     $("#form1").ajaxSubmit(function(data) {  
20.         data = eval('(' + data + ')');  
21.         if(data.code == 0){   
22.         }else if(data.code == -1){            
23.         }else{  
24.             alert("系统繁忙，请稍后重试!");  
25.         }  
26.      });  
27.       
28.     return false;  
29. }