jquery.validate.js之自定义表单验证规则

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery.validate.js之自定义表单验证规则相关的知识,希望对你有一定的参考价值。

 1 <html>
 2     <head>
 3         <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 4         <script type="text/javascript" src="jquery-1.8.3.js"></script>
 5         <script type="text/javascript" src="jquery.validate-1.8.1.js"></script>
 6 
 7         <script type="text/javascript">
 8             $.validator.addMethod(‘checkNum‘,function(value,element){//自定义验证规则方法
 9                     var res=false;
10                     var startNum= $(‘#Begin‘).val();
11                     var endNum= $(‘#End‘).val();
12                     //var endNum=$.trim(value);    
13                     if(startNum>=endNum){
14                         result=false;
15                     }else{
16                         result=true;
17                     }
18                     return this.optional(element)||result;    
19 
20             });
21         
22             $(function(){
23                 $(‘#share‘).validate({
24                     rules:{
25                         Begin:{//要验证的标签的name值
26                             digits:true,//这是jquery.validate-1.8.1.js默认的,要求输入数字,
27                                         //其他用法可自行查看文档
28                         },
29                         End:{
30                             digits:true,
31                             checkNum:true,//这个自定义规则的验证方法
32                             
33                         }
34                     },
35                     messages:{ //验证不通过是提示的自定义提示信息
36                         Begin:{
37                             digits:"必须输入整数",
38                         },
39                         End:{
40                             digits:"必须输入整数",
41                             checkNum:"后个数必须要大于前一个数",
42                             
43                         },
44                         
45                     }
46                 });                
47             });
48 
49         </script>
50     </head>
51     <body>
52         <div style="width:500px;height:500px;" >
53             <form id="share" method="get"  action="">
54                 第一个:<input id="Begin" name="Begin" type="text"/><br/>
55                 第二个:<input id="End" name="End" type="text"/><br/>
56                 <input type="submit" value="验证">
57             </from>
58         </div>
59     </body>
60 </html>
技术分享
技术分享


 

以上是关于jquery.validate.js之自定义表单验证规则的主要内容,如果未能解决你的问题,请参考以下文章

jquery.validate.js自定义表单验证

jquery.validate.js表单验证

jQuery表单验证插件——jquery.validate.js

JQuery.Validate学习笔记

Jquery.validate.js实现前端表单验证

jquery.validate.js 验证框架详解