jQuery.validate学习笔记

jQuery的validate验证功能十分强大，但是能够自定义验证方法更具有灵活性，所以我只是把自定义的说明一下。

添加自定义方法是使用jquery的jQuery.validator.addMethod方法，这个方法的完整定义如下：

 jQuery.validator.addMethod("myValidateName", function(value, element, param) {
 //myValidateName是自己定义的验证方法值
 //value是指当前校验域的值
 //element是指当前检验的域
 //param是指在rules中设定的参数
 },$.validator.format("xxx"));

定义完之后，就可以通过在页面中声明和调用了。调用方法如下：

 var validator = $("#formName").validate({//formName是form的名字
         submitHandler: function(form) { //提交时候调用的方法
             formSubmit();//调用成功后的处理函数
         } ,
         rules: {
             inputName1: "myValidateName",//如果只用一个验证方式的话，需要用引号标记上，而且这种方式是认为强制执行的，也就是一定要验证的
             inputName2: {//如果想使用多种验证方式，就需要使用花括号标记上，且逗号隔开，记住：最后一项不要有逗号
                 myValidateName1: true,//这种是强制执行的验证
                 myValidateName2: function(){if(某条件满足){return true;}else{return false;}},//这种根据条件判断要不要验证，更佳的灵活，用在多条件输入的时候极为方便
                 myValidateName3: [//使用方括号的是对于普通验证的更佳高级方法，这种方法也十分好用
                     function(){if(某条件满足){return true;}else{return false;}},//同上，验证条件判断，条件不满足，本验证就不生效
                     rangeValue1,//阈值控制值，这个值可以有任意多个，就看你的验证方法中是怎样声明的了
                     rangeValue2//阈值控制值
                 ]
             }
         },
         messages: {//验证到不合法的值的提示信息，如果不加这部分，就会执行你声明函数的时候的默认提示：“xxx”，就是在$.validator.format("xxx"));中声明的那个提示
             inputName1: "AAA",//这种写法是将所有验证不通过的全部提示AAA
             inputName2: {//这种就是更佳详细的提示，当然也可以使用上面的这种方式，无论myValidateName1，2还是3，只要有不通过的，都会提示同一条信息。
                 myValidateName1:"BBB",//但是如果详细些的提示，就需要用花括号标记上，并且内部用逗号隔开，且最后一个后面不能有逗号，就相当于使用数组的方式
                 myValidateName2:"CCC",
                 myValidateName3:"DDD"//这里后面不能有逗号了，不然在有些浏览器中会报错
             }
         },

         errorPlacement: function(error, element) {//这里定义的是出错或者叫提示信息出现的位置
             error.insertAfter(element.parent().find('label:first'));//这句话的意思就是说，在验证不通过的那个标签上面的父节点开始向下找到第一个lable标签的后面，进行插入
         },  //就是这样，如下面：
             //
             //  mylablename 这里是你定义的一个lable标签
             //
             //

  

            //如果验证不通过，那么就会从名字为inputName1的标签开始查找它的父标签，也就是div，然后再从div开始乡下找到第一个lable标签，就是mylablename那行，然后再在这行之后进行插入错误信息  

            //执行之后，大概就是下面的样子：  

            //

  

            //  mylablename 这里是你定义的一个lable标签  

            //  AAA这里是你验证不通过时的提示信息  

            //    

            //

  

          

        success: function(label) {  

            // set   as text for IE  

            label.html(" ").addClass("ok");//这个就是如果验证通过了，就再在提示的那行lable标签中添加名字为ok的class类，用于改变css样式，至于名字随便起  

        }  

    });  

 下面举一个具体的例子

首先定义自己的验证方法，定义到myvalidate.js中，内容如下

 $(document).ready(function(){
 //验证IP地址
     jQuery.validator.addMethod("isIP", function(value, element, param) {
         if ( !this.depend(param, element) )//这个判断必须要加上，这个是判断是否要执行这个检测，就是对于rules中定义的isIP后面的条件的判断，如果不满足，就不再验证了
             return "dependency-mismatch";  //所以我说，这里必须要加上，其实也不是必须，但是这样会十分灵活，根据你的意愿让它到底何时验证
         var reg = new RegExp(getReg("ip"),"i");  //这里是一个正则表达式，具体是怎样的，就不列出来了，不懂的，自己百度一下正则表达式，很简单的
         return this.optional(element) || (reg.test(value)); //前面optional这部分我也不清楚是啥意思，但是看官方的js脚本都是加上的，那么咱们也照样加上，
                                                             //然后后面的这部分才是你真正的判断，注意：只有return false的时候，才会显示你的提示，如果返回的是true，那么就进入到了前面success函数哪里
     }, $.validator.format("not IP"));//这里就是如果没有通过验证要提示给用户的信息，显示位置由你声明调用的时候规定，在前文中有说明

 //验证在一定范围内的数值，这个例子就比较麻烦的那个，也就是前面说的是用方括号的那个
     jQuery.validator.addMethod("isMyRange", function(value, element, param) {
         if ( !this.depend(param[0], element) )//这里的param[0]，就代表调用定义中的方括号中的第一个元素，如果按照前面myValidateName3的例子的话，它就是对应function那一行
             return "dependency-mismatch";
         var reg = new RegExp(getReg("integer65535"),"i");  //因为是判断数值，所以首先用正则表达式判断一下是不是数值，别验证半天，结果人家用户根本就没输入数值
         return this.optional(element) || (reg.test(value) && value >= param[1] && value <= param[2]);//这里的param[1]和param[2]就分别代表着第二和第三个元素，也就是rangeValue1和rangeValue2，那么这个验证的目的就是验证在rangeValue1和rangeValue2之间的数值
     }, $.validator.format("请输入 {1} 和 {2} 之间的数值"));//这里也需要注意，其中的{1}和{2}是分别代表你定义的rangeValue1和rangeValue2这两个值，其实，这里的{1}和{2}就是你在rulse中的那个方括号中定义的元素的下标，有过c语言或者程序开发的肯定再熟悉不过了，对，就是数组嘛
 });

下面在html页面中添加定义
比如我有个页面，叫test.html，内容如下：

 <html>
 <script type="text/javascript" src="js/jquery-1.4.2.min.js">script>
 <script type="text/javascript" src="js/jquery.validate.js">script>
 <script type="text/javascript" src="js/myvalidate">script>
 <script type="text/javascript">
 $(document).ready(function(){//开始声明验证方法

     var validator = $("#myform").validate({
         submitHandler: function(form) { //提交时候调用的方法
             formSubmit();
         } ,
         rules: {
             myipaddr: {
                 isIP: "#myradio_on:checked"//这里就是说当id为myradio_on的radio元素被选中的时候开始验证
             },
             mycount: {
                 isMyRange: [
                     "#myradio_on:checked",//同上
                     200,
                     800
                     ]
             }
         },
         //这里我省略掉了message，使用默认的提示，也就是我定义验证方法时给出的提示
         // the errorPlacement has to take the layout into account
         errorPlacement: function(error, element) {
             error.insertAfter(element.parent().find('label:first'));
         },
         // set new class to error-labels to indicate valid fields
         success: function(label) {
             // set   as text for IE
             label.html(" ").addClass("ok");
         }
     });
 });

 script>
 <body>
     <form name="myform" id="myform" method="post" action="myaction.html">
     <div>
         <p>
             <label>是否验证label><br/>
             <input type="radio" name="validate" id="validate_on"/>

             <input type="radio" name="validate" id="myradio_off"/>
             <label for="myradio_off">算了label>
         p>
     div>
     <div>
         <p>
             <label>IP验证label><br/>
             <input type="text" name="myipaddr" id="myipaddr"/>
         p>
     div>
     <div>
         <p>
             <label>Count验证label><br/>
             <input type="text" name="mycount" id="mycount"/>
         p>
     div>
     form>
 body>
 html>

 

到此一个完整的验证就出来了，你可以试一下，现在感觉确实很强大，如果有错误，希望大家指正，相互学习

下面附注一下jquery.validate.js文件中的内容，有部分有些改动，并非原版官方的，但是绝大多数都是一样的，大家可以看看，相信一定能学到很多东西

 /*
  * jQuery validation plug-in 1.7
  *
  * http://bassistance.de/jquery-plugins/jquery-plugin-validation/
  * http://docs.jquery.com/Plugins/Validation
  *
  * Copyright (c) 2006 - 2008 Jörn Zaefferer
  *
  * $Id: jquery.validate.js 6403 2009-06-17 14:27:16Z joern.zaefferer $
  *
  * Dual licensed under the MIT and GPL licenses:
  *   http://www.opensource.org/licenses/mit-license.php
  *   http://www.gnu.org/licenses/gpl.html
  */

 (function($) {

 $.extend($.fn, {
     // http://docs.jquery.com/Plugins/Validation/validate
     validate: function( options ) {

         // if nothing is selected, return nothing; can't chain anyway
         if (!this.length) {
             options && options.debug && window.console && console.warn( "nothing selected, can't validate, returning nothing" );
             return;
         }

         // check if a validator for this form was already created
         var validator = $.data(this[0], 'validator');
         if ( validator ) {
             return validator;
         }

         validator = new $.validator( options, this[0] );
         $.data(this[0], 'validator', validator);

         if ( validator.settings.onsubmit ) {

             // allow suppresing validation by adding a cancel class to the submit button
             this.find("input, button").filter(".cancel").click(function() {
                 validator.cancelSubmit = true;
             });

             // when a submitHandler is used, capture the submitting button
             if (validator.settings.submitHandler) {
                 this.find("input, button").filter(":submit").click(function() {
                     validator.submitButton = this;
                 });
             }

             // validate the form on submit
             this.submit( function( event ) {
                 if ( validator.settings.debug )
                     // prevent form submit to be able to see console output
                     event.preventDefault();

                 function handle() {
                     if ( validator.settings.submitHandler ) {
                         if (validator.submitButton) {
                             // insert a hidden input as a replacement for the missing submit button
                             var hidden = $("").attr("name", validator.submitButton.name).val(validator.submitButton.value).appendTo(validator.currentForm);
                         }
                         validator.settings.submitHandler.call( validator, validator.currentForm );
                         if (validator.submitButton) {
                             // and clean up afterwards; thanks to no-block-scope, hidden can be referenced
                             hidden.remove();
                         }
                         return false;
                     }
                     return true;
                 }

                 // prevent submit for invalid forms or custom submit handlers
                 if ( validator.cancelSubmit ) {
                     validator.cancelSubmit = false;
                     return handle();
                 }
                 if ( validator.form() ) {
                     if ( validator.pendingRequest ) {
                         validator.formSubmitted = true;
                         return false;
                     }
                     return handle();
                 } else {
                     validator.focusInvalid();
                     return false;
                 }
             });
         }

         return validator;
     },
     // http://docs.jquery.com/Plugins/Validation/valid
     valid: function() {
         if ( $(this[0]).is('form')) {
             return this.validate().form();
         } else {
             var valid = true;
             var validator = $(this[0].form).validate();
             this.each(function() {
                 valid &= validator.element(this);
             });
             return valid;
         }
     },
     // attributes: space seperated list of attributes to retrieve and remove
     removeAttrs: function(attributes) {
         var result = {},
             $element = this;
         $.each(attributes.split(/\s/), function(index, value) {
             result[value] = $element.attr(value);
             $element.removeAttr(value);
         });
         return result;
     },
     // http://docs.jquery.com/Plugins/Validation/rules
     rules: function(command, argument) {
         var element = this[0];

         if (command) {
             var settings = $.data(element.form, 'validator').settings;
             var staticRules = settings.rules;
             var existingRules = $.validator.staticRules(element);
             switch(command) {
             case "add":
                 $.extend(existingRules, $.validator.normalizeRule(argument));
                 staticRules[element.name] = existingRules;
                 if (argument.messages)
                     settings.messages[element.name] = $.extend( settings.messages[element.name], argument.messages );
                 break;
             case "remove":
                 if (!argument) {
                     delete staticRules[element.name];
                     return existingRules;
                 }
                 var filtered = {};
                 $.each(argument.split(/\s/), function(index, method) {
                     filtered[method] = existingRules[method];
                     delete existingRules[method];
                 });
                 return filtered;
             }
         }

         var data = $.validator.normalizeRules(
         $.extend(
             {},
             $.validator.metadataRules(element),
             $.validator.classRules(element),
             $.validator.attributeRules(element),
             $.validator.staticRules(element)
         ), element);

         // make sure required is at front
         if (data.required) {
             var param = data.required;
             delete data.required;
             data = $.extend({required: param}, data);
         }

         return data;
     }
 });

 // Custom selectors
 $.extend($.expr[":"], {
     // http://docs.jquery.com/Plugins/Validation/blank
     blank: function(a) {return !$.trim("" + a.value);},
     // http://docs.jquery.com/Plugins/Validation/filled
     filled: function(a) {return !!$.trim("" + a.value);},
     // http://docs.jquery.com/Plugins/Validation/unchecked
     unchecked: function(a) {return !a.checked;}
 });

 // constructor for validator
 $.validator = function( options, form ) {
     this.settings = $.extend( true, {}, $.validator.defaults, options );
     this.currentForm = form;
     this.init();
 };

 $.validator.format = function(source, params) {
     if ( arguments.length == 1 )
         return function() {
             var args = $.makeArray(arguments);
             args.unshift(source);
             return $.validator.format.apply( this, args );
         };
     if ( arguments.length > 2 && params.constructor != Array  ) {
         params = $.makeArray(arguments).slice(1);
     }
     if ( params.constructor != Array ) {
         params = [ params ];
     }
     $.each(params, function(i, n) {
         source = source.replace(new RegExp("\\{" + i + "\\}", "g"), n);
     });
     return source;
 };

 $.extend($.validator, {

     defaults: {
         messages: {},
         groups: {},
         rules: {},
         errorClass: "error",
         validClass: "valid",
         errorElement: "label",
         focusInvalid: true,
         errorContainer: $( [] ),
         errorLabelContainer: $( [] ),
         onsubmit: true,
         ignore: [],
         ignoreTitle: false,
         onfocusin: function(element) {
             this.lastActive = element;

             // hide error label and remove error class on focus if enabled
             if ( this.settings.focusCleanup && !this.blockFocusCleanup ) {
                 this.settings.unhighlight && this.settings.unhighlight.call( this, element, this.settings.errorClass, this.settings.validClass );
                 this.errorsFor(element).hide();
             }
         },
         onfocusout: function(element) {
             if ( !this.checkable(element) && (element.name in this.submitted || !this.optional(element)) ) {
                 this.element(element);
             }
         },
         onkeyup: function(element) {
             if ( element.name in this.submitted || element == this.lastElement ) {
                 this.element(element);
             }
         },
         onclick: function(element) {
             // click on selects, radiobuttons and checkboxes
             if ( element.name in this.submitted )
                 this.element(element);
             // or option elements, check parent select in that case
             else if (element.parentNode.name in this.submitted)
                 this.element(element.parentNode);
         },
         highlight: function( element, errorClass, validClass ) {
             $(element).addClass(errorClass).removeClass(validClass);
         },
         unhighlight: function( element, errorClass, validClass ) {
             $(element).removeClass(errorClass).addClass(validClass);
         }
     },

     // http://docs.jquery.com/Plugins/Validation/Validator/setDefaults
     setDefaults: function(settings) {
         $.extend( $.validator.defaults, settings );
     },

     messages: {
         required: "不能为空.",
         remote: "Please fix this field.",
         email: "请输入正确的邮件地址.",
         url: "请输入正确的URL地址，如http://www.helloweba.com",
         date: "Please enter a valid date.",
         dateISO: "格式错误!",
         number: "请填写合适的数字.",
         digits: "只能输入数字.",
         creditcard: "Please enter a valid credit card number.",
         equalTo: "两次密码输入不一致.",
         accept: "文件格式不对！",
         maxlength: $.validator.format("您输入的字符数不能大于 {0} 位."),
         minlength: $.validator.format("您输入的字符数不能小于 {0} 位."),
         rangelength: $.validator.format("Please enter a value between {0} and {1} characters long."),
         range: $.validator.format("您输入的值的范围应该在 {0} 和 {1} 之间."),
         max: $.validator.format("Please enter a value less than or equal to {0}."),
         min: $.validator.format("Please enter a value greater than or equal to {0}.")
     },

     autoCreateRanges: false,

     prototype: {

         init: function() {
             this.labelContainer = $(this.settings.errorLabelContainer);
             this.errorContext = this.labelContainer.length && this.labelContainer || $(this.currentForm);
             this.containers = $(this.settings.errorContainer).add( this.settings.errorLabelContainer );
             this.submitted = {};
             this.valueCache = {};
             this.pendingRequest = 0;
             this.pending = {};
             this.invalid = {};
             this.reset();

             var groups = (this.groups = {});
             $.each(this.settings.groups, function(key, value) {
                 $.each(value.split(/\s/), function(index, name) {
                     groups[name] = key;
                 });
             });
             var rules = this.settings.rules;
             $.each(rules, function(key, value) {
                 rules[key] = $.validator.normalizeRule(value);
             });

             function delegate(event) {
                 var validator = $.data(this[0].form, "validator"),
                     eventType = "on" + event.type.replace(/^validate/, "");
                 validator.settings[eventType] && validator.settings[eventType].call(validator, this[0] );
             }
             $(this.currentForm)
                 .validateDelegate(":text, :password, :file, select, textarea", "focusin focusout keyup", delegate)
                 .validateDelegate(":radio, :checkbox, select, option", "click", delegate);

             if (this.settings.invalidHandler)
                 $(this.currentForm).bind("invalid-form.validate", this.settings.invalidHandler);
         },

         // http://docs.jquery.com/Plugins/Validation/Validator/form
         form: function() {
             this.checkForm();
             $.extend(this.submitted, this.errorMap);
             this.invalid = $.extend({}, this.errorMap);
             if (!this.valid())
                 $(this.currentForm).triggerHandler("invalid-form", [this]);
             this.showErrors();
             return this.valid();
         },

         checkForm: function() {
             this.prepareForm();
             for ( var i = 0, elements = (this.currentElements = this.elements()); elements[i]; i++ ) {
                 this.check( elements[i] );
             }
             return this.valid();
         },

         // http://docs.jquery.com/Plugins/Validation/Validator/element
         element: function( element ) {
             element = this.clean( element );
             this.lastElement = element;
             this.prepareElement( element );
             this.currentElements = $(element);
             var result = this.check( element );
             if ( result ) {
                 delete this.invalid[element.name];
             } else {
                 this.invalid[element.name] = true;
             }
             if ( !this.numberOfInvalids() ) {
                 // Hide error containers on last error
                 this.toHide = this.toHide.add( this.containers );
             }
             this.showErrors();
             return result;
         },

         // http://docs.jquery.com/Plugins/Validation/Validator/showErrors
         showErrors: function(errors) {
             if(errors) {
                 // add items to error list and map
                 $.extend( this.errorMap, errors );
                 this.errorList = [];
                 for ( var name in errors ) {
                     this.errorList.push({
                         message: errors[name],
                         element: this.findByName(name)[0]
                     });
                 }
                 // remove items from success list
                 this.successList = $.grep( this.successList, function(element) {
                     return !(element.name in errors);
                 });
             }
             this.settings.showErrors
                 ? this.settings.showErrors.call( this, this.errorMap, this.errorList )
                 : this.defaultShowErrors();
         },

         // http://docs.jquery.com/Plugins/Validation/Validator/resetForm
         resetForm: function() {
             if ( $.fn.resetForm )
                 $( this.currentForm ).resetForm();
             this.submitted = {};
             this.prepareForm();
             this.hideErrors();
             this.elements().removeClass( this.settings.errorClass );
         },

         numberOfInvalids: function() {
             return this.objectLength(this.invalid);
         },

         objectLength: function( obj ) {
             var count = 0;
             for ( var i in obj )
                 count++;
             return count;
         },

         hideErrors: function() {
             this.addWrapper( this.toHide ).hide();
         },

         valid: function() {
             return this.size() == 0;
         },

         size: function() {
             return this.errorList.length;
         },

         focusInvalid: function() {
             if( this.settings.focusInvalid ) {
                 try {
                     $(this.findLastActive() || this.errorList.length && this.errorList[0].element || [])
                     .filter(":visible")
                     .focus()
                     // manually trigger focusin event; without it, focusin handler isn't called, findLastActive won't have anything to find
                     .trigger("focusin");
                 } catch(e) {
                     // ignore IE throwing errors when focusing hidden elements
                 }
             }
         },

         findLastActive: function() {
             var lastActive = this.lastActive;
             return lastActive && $.grep(this.errorList, function(n) {
                 return n.element.name == lastActive.name;
             }).length == 1 && lastActive;
         },

         elements: function() {
             var validator = this,
                 rulesCache = {};

             // select all valid inputs inside the form (no submit or reset buttons)
             // workaround $Query([]).add until http://dev.jquery.com/ticket/2114 is solved
             return $([]).add(this.currentForm.elements)
             .filter(":input")
             .not(":submit, :reset, :image, [disabled]")
             .not( this.settings.ignore )
             .filter(function() {
                 !this.name && validator.settings.debug && window.console && console.error( "%o has no name assigned", this);

                 // select only the first element for each name, and only those with rules specified
                 if ( this.name in rulesCache || !validator.objectLength($(this).rules()) )
                     return false;

                 rulesCache[this.name] = true;
                 return true;
             });
         },

         clean: function( selector ) {
             return $( selector )[0];
         },

         errors: function() {
             return $( this.settings.errorElement + "." + this.settings.errorClass, this.errorContext );
         },

         reset: function() {
             this.successList = [];
             this.errorList = [];
             this.errorMap = {};
             this.toShow = $([]);
             this.toHide = $([]);
             this.currentElements = $([]);
         },

         prepareForm: function() {
             this.reset();
             this.toHide = this.errors().add( this.containers );
         },

         prepareElement: function( element ) {
             this.reset();
             this.toHide = this.errorsFor(element);
         },

         check: function( element ) {
             element = this.clean( element );

             // if radio/checkbox, validate first element in group instead
             if (this.checkable(element)) {
                 element = this.findByName( element.name )[0];
             }

             var rules = $(element).rules();
             var dependencyMismatch = false;
             for( method in rules ) {
                 var rule = { method: method, parameters: rules[method] };
                 try {
                     var result = $.validator.methods[method].call( this, element.value.replace(/\r/g, ""), element, rule.parameters );

                     // if a method indicates that the field is optional and therefore valid,
                     // don't mark it as valid when there are no other rules
                     if ( result == "dependency-mismatch" ) {
                         dependencyMismatch = true;
                         continue;
                     }
                     dependencyMismatch = false;

                     if ( result == "pending" ) {
                         this.toHide = this.toHide.not( this.errorsFor(element) );
                         return;
                     }

                     if( !result ) {
                         this.formatAndAdd( element, rule );
                         return false;
                     }
                 } catch(e) {
                     this.settings.debug && window.console && console.log("exception occured when checking element " + element.id
                          + ", check the '" + rule.method + "' method", e);
                     throw e;
                 }
             }
             if (dependencyMismatch)
                 return;
             if ( this.objectLength(rules) )
                 this.successList.push(element);
             return true;
         },

         // return the custom message for the given element and validation method
         // specified in the element's "messages" metadata
         customMetaMessage: function(element, method) {
             if (!$.metadata)
                 return;

             var meta = this.settings.meta
                 ? $(element).metadata()[this.settings.meta]
                 : $(element).metadata();

             return meta && meta.messages && meta.messages[method];
         },

         // return the custom message for the given element name and validation method
         customMessage: function( name, method ) {
             var m = this.settings.messages[name];
             return m && (m.constructor == String
                 ? m
                 : m[method]);
         },

         // return the first defined argument, allowing empty strings
         findDefined: function() {
             for(var i = 0; i < arguments.length; i++) {
                 if (arguments[i] !== undefined)
                     return arguments[i];
             }
             return undefined;
         },

         defaultMessage: function( element, method) {
             return this.findDefined(
                 this.customMessage( element.name, method ),
                 this.customMetaMessage( element, method ),
                 // title is never undefined, so handle empty string as undefined
                 !this.settings.ignoreTitle && element.title || undefined,
                 $.validator.messages[method],
                 "Warning: No message defined for " + element.name + ""
             );
         },

         formatAndAdd: function( element, rule ) {
             var message = this.defaultMessage( element, rule.method ),
                 theregex = /\$?\{(\d+)\}/g;
             if ( typeof message == "function" ) {
                 message = message.call(this, rule.parameters, element);
             } else if (theregex.test(message)) {
                 message = jQuery.format(message.replace(theregex, '{$1}'), rule.parameters);
             }
             this.errorList.push({
                 message: message,
                 element: element
             });

             this.errorMap[element.name] = message;
             this.submitted[element.name] = message;
         },

         addWrapper: function(toToggle) {
             if ( this.settings.wrapper )
                 toToggle = toToggle.add( toToggle.parent( this.settings.wrapper ) );
             return toToggle;
         },

         defaultShowErrors: function() {
             for ( var i = 0; this.errorList[i]; i++ ) {
                 var error = this.errorList[i];
                 this.settings.highlight && this.settings.highlight.call( this, error.element, this.settings.errorClass, this.settings.validClass );
                 this.showLabel( error.element, error.message );
             }
             if( this.errorList.length ) {
                 this.toShow = this.toShow.add( this.containers );
             }
             if (this.settings.success) {
                 for ( var i = 0; this.successList[i]; i++ ) {
                     this.showLabel( this.successList[i] );
                 }
             }
             if (this.settings.unhighlight) {
                 for ( var i = 0, elements = this.validElements(); elements[i]; i++ ) {
                     this.settings.unhighlight.call( this, elements[i], this.settings.errorClass, this.settings.validClass );
                 }
             }
             this.toHide = this.toHide.not( this.toShow );
             this.hideErrors();
             this.addWrapper( this.toShow ).show();
         },

         validElements: function() {
             return this.currentElements.not(this.invalidElements());
         },

         invalidElements: function() {
             return $(this.errorList).map(function() {
                 return this.element;
             });
         },

         showLabel: function(element, message) {
             var label = this.errorsFor( element );
             if ( label.length ) {
                 // refresh error/success class
                 label.removeClass().addClass( this.settings.errorClass );

                 // check if we have a generated label, replace the message then
                 label.attr("generated") && label.html(message);
             } else {
                 // create label
                 label = $("<" + this.settings.errorElement + "/>")
                     .attr({"for":  this.idOrName(element), generated: true})
                     .addClass(this.settings.errorClass)
                     .html(message || "");
                 if ( this.settings.wrapper ) {
                     // make sure the element is visible, even in IE
                     // actually showing the wrapped element is handled elsewhere
                     label = label.hide().show().wrap("<" + this.settings.wrapper + "/>").parent();
                 }
                 if ( !this.labelContainer.append(label).length )
                     this.settings.errorPlacement
                         ? this.settings.errorPlacement(label, $(element) )
                         : label.insertAfter(element);
             }
             if ( !message && this.settings.success ) {
                 label.text("");
                 typeof this.settings.success == "string"
                     ? label.addClass( this.settings.success )
                     : this.settings.success( label );
             }
             this.toShow = this.toShow.add(label);
         },

         errorsFor: function(element) {
             var name = this.idOrName(element);
             return this.errors().filter(function() {
                 return $(this).attr('for') == name;
             });
         },

         idOrName: function(element) {
             return this.groups[element.name] || (this.checkable(element) ? element.name : element.id || element.name);
         },

         checkable: function( element ) {
             return /radio|checkbox/i.test(element.type);
         },

         findByName: function( name ) {
             // select by name and filter by form for performance over form.find("[name=...]")
             var form = this.currentForm;
             return $(document.getElementsByName(name)).map(function(index, element) {
                 return element.form == form && element.name == name && element  || null;
             });
         },

         getLength: function(value, element) {
             switch( element.nodeName.toLowerCase() ) {
             case 'select':
                 return $("option:selected", element).length;
             case 'input':
                 if( this.checkable( element) )
                     return this.findByName(element.name).filter(':checked').length;
             }
             return value.length;
         },

         depend: function(param, element) {
             return this.dependTypes[typeof param]
                 ? this.dependTypes[typeof param](param, element)
                 : true;
         },

         dependTypes: {
             "boolean": function(param, element) {
                 return param;
             },
             "string": function(param, element) {
                 return !!$(param, element.form).length;
             },
             "function": function(param, element) {
                 return param(element);
             }
         },

         optional: function(element) {
             return !$.validator.methods.required.call(this, $.trim(element.value), element) && "dependency-mismatch";
         },

         startRequest: function(element) {
             if (!this.pending[element.name]) {
                 this.pendingRequest++;
                 this.pending[element.name] = true;
             }
         },

         stopRequest: function(element, valid) {
             this.pendingRequest--;
             // sometimes synchronization fails, make sure pendingRequest is never < 0
             if (this.pendingRequest < 0)
                 this.pendingRequest = 0;
             delete this.pending[element.name];
             if ( valid && this.pendingRequest == 0 && this.formSubmitted && this.form() ) {
                 $(this.currentForm).submit();
                 this.formSubmitted = false;
             } else if (!valid && this.pendingRequest == 0 && this.formSubmitted) {
                 $(this.currentForm).triggerHandler("invalid-form", [this]);
                 this.formSubmitted = false;
             }
         },

         previousValue: function(element) {
             return $.data(element, "previousValue") || $.data(element, "previousValue", {
                 old: null,
                 valid: true,
                 message: this.defaultMessage( element, "remote" )
             });
         }

     },

     classRuleSettings: {
         required: {required: true},
         email: {email: true},
         url: {url: true},
         date: {date: true},
         dateISO: {dateISO: true},
         dateDE: {dateDE: true},
         number: {number: true},
         numberDE: {numberDE: true},
         digits: {digits: true},
         creditcard: {creditcard: true}
     },

     addClassRules: function(className, rules) {
         className.constructor == String ?
             this.classRuleSettings[className] = rules :
             $.extend(this.classRuleSettings, className);
     },

     classRules: function(element) {
         var rules = {};
         var classes = $(element).attr('class');
         classes && $.each(classes.split(' '), function() {
             if (this in $.validator.classRuleSettings) {
                 $.extend(rules, $.validator.classRuleSettings[this]);
             }
         });
         return rules;
     },

     attributeRules: function(element) {
         var rules = {};
         var $element = $(element);

         for (method in $.validator.methods) {
             var value = $element.attr(method);
             if (value) {
                 rules[method] = value;
             }
         }

         // maxlength may be returned as -1, 2147483647 (IE) and 524288 (safari) for text inputs
         if (rules.maxlength && /-1|2147483647|524288/.test(rules.maxlength)) {
             delete rules.maxlength;
         }

         return rules;
     },

     metadataRules: function(element) {
         if (!$.metadata) return {};

         var meta = $.data(element.form, 'validator').settings.meta;
         return meta ?
             $(element).metadata()[meta] :
             $(element).metadata();
     },

     staticRules: function(element) {
         var rules = {};
         var validator = $.data(element.form, 'validator');
         if (validator.settings.rules) {
             rules = $.validator.normalizeRule(validator.settings.rules[element.name]) || {};
         }
         return rules;
     },

     normalizeRules: function(rules, element) {
         // handle dependency check
         $.each(rules, function(prop, val) {
             // ignore rule when param is explicitly false, eg. required:false
             if (val === false) {
                 delete rules[prop];
                 return;
             }
             if (val.param || val.depends) {
                 var keepRule = true;
                 switch (typeof val.depends) {
                     case "string":
                         keepRule = !!$(val.depends, element.form).length;
                         break;
                     case "function":
                         keepRule = val.depends.call(element, element);
                         break;
                 }
                 if (keepRule) {
                     rules[prop] = val.param !== undefined ? val.param : true;
                 } else {
                     delete rules[prop];
                 }
             }
         });

         // evaluate parameters
         $.each(rules, function(rule, parameter) {
             rules[rule] = $.isFunction(parameter) ? parameter(element) : parameter;
         });

         // clean number parameters
         $.each(['minlength', 'maxlength', 'min', 'max'], function() {
             if (rules[this]) {
                 rules[this] = Number(rules[this]);
             }
         });
         $.each(['rangelength', 'range'], function() {
             if (rules[this]) {
                 rules[this] = [Number(rules[this][0]), Number(rules[this][1])];
             }
         });

         if ($.validator.autoCreateRanges) {
             // auto-create ranges
             if (rules.min && rules.max) {
                 rules.range = [rules.min, rules.max];
                 delete rules.min;
                 delete rules.max;
             }
             if (rules.minlength && rules.maxlength) {
                 rules.rangelength = [rules.minlength, rules.maxlength];
                 delete rules.minlength;
                 delete rules.maxlength;
             }
         }

         // To support custom messages in metadata ignore rule methods titled "messages"
         if (rules.messages) {
             delete rules.messages;
         }

         return rules;
     },

     // Converts a simple string to a {string: true} rule, e.g., "required" to {required:true}
     normalizeRule: function(data) {
         if( typeof data == "string" ) {
             var transformed = {};
             $.each(data.split(/\s/), function() {
                 transformed[this] = true;
             });
             data = transformed;
         }
         return data;
     },

     // http://docs.jquery.com/Plugins/Validation/Validator/addMethod
     addMethod: function(name, method, message) {
         $.validator.methods[name] = method;
         $.validator.messages[name] = message != undefined ? message : $.validator.messages[name];
         if (method.length < 3) {
             $.validator.addClassRules(name, $.validator.normalizeRule(name));
         }
     },

     methods: {

         // http://docs.jquery.com/Plugins/Validation/Methods/required
         required: function(value, element, param) {
             // check if dependency is met
             if ( !this.depend(param, element) )
                 return "dependency-mismatch";
             switch( element.nodeName.toLowerCase() ) {
             case 'select':
                 // could be an array for select-multiple or a string, both are fine this way
                 var val = $(element).val();
                 return val && val.length > 0;
             case 'input':
                 if ( this.checkable(element) )
                     return this.getLength(value, element) > 0;
             default:
                 return $.trim(value).length > 0;
             }
         },

         // http://docs.jquery.com/Plugins/Validation/Methods/remote
         remote: function(value, element, param) {
             if ( this.optional(element) )
                 return "dependency-mismatch";

             var previous = this.previousValue(element);
             if (!this.settings.messages[element.name] )
                 this.settings.messages[element.name] = {};
             previous.originalMessage = this.settings.messages[element.name].remote;
             this.settings.messages[element.name].remote = previous.message;

             param = typeof param == "string" && {url:param} || param;

             if ( previous.old !== value ) {
                 previous.old = value;
                 var validator = this;
                 this.startRequest(element);
                 var data = {};
                 data[element.name] = value;
                 $.ajax($.extend(true, {
                     url: param,
                     //url: param.url,
                     mode: "abort",
                     port: "validate" + element.name,
                     dataType: "json",
                     data: data,
                     //data: param.data || data,
                     success: function(response) {
                         validator.settings.messages[element.name].remote = previous.originalMessage;
                         var valid = response === true;
                         if ( valid ) {
                             var submitted = validator.formSubmitted;
                             validator.prepareElement(element);
                             validator.formSubmitted = submitted;
                             validator.successList.push(element);
                             validator.showErrors();
                         } else {
                             var errors = {};
                             var message = (previous.message = response || validator.defaultMessage( element, "remote" ));
                             errors[element.name] = $.isFunction(message) ? message(value) : message;
                             validator.showErrors(errors);
                         }
                         previous.valid = valid;
                         validator.stopRequest(element, valid);
                     }
                 }, param));
                 return "pending";
             } else if( this.pending[element.name] ) {
                 return "pending";
             }
             return previous.valid;
         },

         // http://docs.jquery.com/Plugins/Validation/Methods/minlength
         minlength: function(value, element, param) {
             return this.optional(element) || this.getLength($.trim(value), element) >= param;
         },

         // http://docs.jquery.com/Plugins/Validation/Methods/maxlength
         maxlength: function(value, element, param) {
             return this.optional(element) || this.getLength($.trim(value), element) <= param;
         },

         // http://docs.jquery.com/Plugins/Validation/Methods/rangelength
         rangelength: function(value, element, param) {
             var length = this.getLength($.trim(value), element);
             return this.optional(element) || ( length >= param[0] && length <= param[1] );
         },

         // http://docs.jquery.com/Plugins/Validation/Methods/min
         min: function( value, element, param ) {
             return this.optional(element) || value >= param;
         },

         // http://docs.jquery.com/Plugins/Validation/Methods/max
         max: function( value, element, param ) {
             return this.optional(element) || value <= param;
         },

         // http://docs.jquery.com/Plugins/Validation/Methods/range
         range: function( value, element, param ) {
             return this.optional(element) || ( value >= param[0] && value <= param[1] );
         },

         // http://docs.jquery.com/Plugins/Validation/Methods/email
         email: function(value, element) {
             // contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
             return this.optional(element) || /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(value);
         },

         // 验证身份证