jQuery.validate学习笔记

    xiaoxiao2021-04-17  38

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

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

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

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

    [javascript]  view plain  copy 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标签的后面,进行插入           },  //就是这样,如下面:               //<div>               //  <lable>mylablename</lable> 这里是你定义的一个lable标签               //  <input name="inputName1" type="text" />               //</div>               //如果验证不通过,那么就会从名字为inputName1的标签开始查找它的父标签,也就是div,然后再从div开始乡下找到第一个lable标签,就是mylablename那行,然后再在这行之后进行插入错误信息               //执行之后,大概就是下面的样子:               //<div>               //  <lable>mylablename</lable> 这里是你定义的一个lable标签               //  <lable>AAA</lable>这里是你验证不通过时的提示信息               //  <input name="inputName1" type="text" />               //</div>                      success: function(label) {               // set   as text for IE               label.html(" ").addClass("ok");//这个就是如果验证通过了,就再在提示的那行lable标签中添加名字为ok的class类,用于改变css样式,至于名字随便起           }       });  

     下面举一个具体的例子

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

    [javascript]  view plain  copy $(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]  view plain  copy <html>   <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script><!-- 先要包含jquery库 -->   <script type="text/javascript" src="js/jquery.validate.js"></script><!-- 还要包含jquery.validate库 -->   <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文件中的内容,有部分有些改动,并非原版官方的,但是绝大多数都是一样的,大家可以看看,相信一定能学到很多东西

    [javascript]  view plain  copy /*   * 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 = $("<input type='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( thisthis.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() {               ifthis.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],                   "<strong>Warning: No message defined for " + element.name + "</strong>"               );           },                      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 );               }               ifthis.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':                   ifthis.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) {           iftypeof 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 ifthis.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);           },                      // 验证身份证           //dateISO: function(value, element) {           //  return this.optional(element) || /^\d{4}[\/-]\d{1,2}[\/-]\d{1,2}$/.test(value);           //},                      // http://docs.jquery.com/Plugins/Validation/Methods/url           url: function(value, element) {               // contributed by Scott Gonzalez: http://projects.scottsplayground.com/iri/               return this.optional(element) || /^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&' \*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([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])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&' \*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&' \*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&' \*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&' \*\+,;=]|:|@)|\/|\?)*)?$/i.test(value);           },                      // http://docs.jquery.com/Plugins/Validation/Methods/date           date: function(value, element) {               return this.optional(element) || !/Invalid|NaN/.test(new Date(value));           },                  // http://docs.jquery.com/Plugins/Validation/Methods/dateISO           dateISO: function(value, element) {               return this.optional(element) || /^\d{4}[\/-]\d{1,2}[\/-]\d{1,2}$/.test(value);           },                  // http://docs.jquery.com/Plugins/Validation/Methods/number           number: function(value, element) {               return this.optional(element) || /^-?(?:\d+|\d{1,3}(?:,\d{3})+)(?:\.\d+)?$/.test(value);           },                  // http://docs.jquery.com/Plugins/Validation/Methods/digits           digits: function(value, element) {               return this.optional(element) || /^\d+$/.test(value);           },                      // http://docs.jquery.com/Plugins/Validation/Methods/creditcard           // based on http://en.wikipedia.org/wiki/Luhn           creditcard: function(value, element) {               if ( this.optional(element) )                   return "dependency-mismatch";               // accept only digits and dashes               if (/[^0-9-]+/.test(value))                   return false;               var nCheck = 0,                   nDigit = 0,                   bEven = false;                  value = value.replace(/\D/g, "");                  for (var n = value.length - 1; n >= 0; n--) {                   var cDigit = value.charAt(n);                   var nDigit = parseInt(cDigit, 10);                   if (bEven) {                       if ((nDigit *= 2) > 9)                           nDigit -= 9;                   }                   nCheck += nDigit;                   bEven = !bEven;               }                  return (nCheck % 10) == 0;           },                      // http://docs.jquery.com/Plugins/Validation/Methods/accept           accept: function(value, element, param) {               param = typeof param == "string" ? param.replace(/,/g, '|') : "png|jpe?g|gif";               return this.optional(element) || value.match(new RegExp(".(" + param + ")$""i"));            },                      // http://docs.jquery.com/Plugins/Validation/Methods/equalTo           equalTo: function(value, element, param) {               // bind to the blur event of the target in order to revalidate whenever the target field is updated               // TODO find a way to bind the event just once, avoiding the unbind-rebind overhead               var target = $(param).unbind(".validate-equalTo").bind("blur.validate-equalTo"function() {                   $(element).valid();               });               return value == target.val();           }                  }          });      // deprecated, use $.validator.format instead   $.format = $.validator.format;      })(jQuery);      // ajax mode: abort   // usage: $.ajax({ mode: "abort"[, port: "uniqueport"]});   // if mode:"abort" is used, the previous request on that port (port can be undefined) is aborted via XMLHttpRequest.abort()    ;(function($) {       var ajax = $.ajax;       var pendingRequests = {};       $.ajax = function(settings) {           // create settings for compatibility with ajaxSetup           settings = $.extend(settings, $.extend({}, $.ajaxSettings, settings));           var port = settings.port;           if (settings.mode == "abort") {               if ( pendingRequests[port] ) {                   pendingRequests[port].abort();               }               return (pendingRequests[port] = ajax.apply(this, arguments));           }           return ajax.apply(this, arguments);       };   })(jQuery);      // provides cross-browser focusin and focusout events   // IE has native support, in other browsers, use event caputuring (neither bubbles)      // provides delegate(type: String, delegate: Selector, handler: Callback) plugin for easier event delegation   // handler is only called when $(event.target).is(delegate), in the scope of the jquery-object for event.target    ;(function($) {       // only implement if not provided by jQuery core (since 1.4)       // TODO verify if jQuery 1.4's implementation is compatible with older jQuery special-event APIs       if (!jQuery.event.special.focusin && !jQuery.event.special.focusout && document.addEventListener) {           $.each({               focus: 'focusin',               blur: 'focusout'               }, function( original, fix ){               $.event.special[fix] = {                   setup:function() {                       this.addEventListener( original, handler, true );                   },                   teardown:function() {                       this.removeEventListener( original, handler, true );                   },                   handler: function(e) {                       arguments[0] = $.event.fix(e);                       arguments[0].type = fix;                       return $.event.handle.apply(this, arguments);                   }               };               function handler(e) {                   e = $.event.fix(e);                   e.type = fix;                   return $.event.handle.call(this, e);               }           });       };       $.extend($.fn, {           validateDelegate: function(delegate, type, handler) {               return this.bind(type, function(event) {                   var target = $(event.target);                   if (target.is(delegate)) {                       return handler.apply(target, arguments);                   }               });           }       });   })(jQuery); 
    转载请注明原文地址: https://ju.6miu.com/read-673358.html

    最新回复(0)