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标签的后面，进行插入
}, //就是这样，如下面：
//<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中，内容如下
$(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><!-- 先要包含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文件中的内容，有部分有些改动，并非原版官方的，但是绝大多数都是一样的，大家可以看看，相信一定能学到很多东西
/*
* 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( 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],
"<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 );
}
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);
},
// 验证身份证
//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);