名稱
返回類型
描述
validate(options)
返回:Validator
驗證所選的FORM
valid()
返回:Boolean
檢查是否驗證通過
rules()
返回:Options
返回元素的驗證規則
rules("add",rules)
返回:Options
增加驗證規則
rules("remove",rules)
返回:Options
刪除驗證規則
removeAttrs(attributes)
返回:Options
刪除特殊屬性並且返回他們
Custom selectors
:blank
返回:Validator
沒有值的篩選器
:filled
返回:Array <Element >
有值的篩選器
:unchecked
返回:Array <Element >
沒選擇的元素的篩選器
Utilities
jQuery.format
(template,argument ,argumentN...)
返回:String
用參數代替模板中的 {n}
Validator:
validate方法返回一個Validator對象,它有很多方法, 讓你能使用引發校驗程序或者改變form的內容. validator對象有很多方法,但下面只是列出常用的
form()
返回:Boolean
驗證form返回成功還是失敗
element(element)
返回:Boolean
驗證單個元素是成功還是失敗
resetForm()
返回:undefined
把前面驗證的FORM恢復到
驗證前原來的狀態
showErrors(errors)
返回:undefined
顯示特定的錯誤信息
Validator functions:
setDefaults(defaults)
返回:undefined
改變默認的設置
addMethod(name,method,message)
返回:undefined
添加一個新的驗證方法.
必須包括一個獨一無二的
名字,一個JAVAS
一個默認的信息
addClassRules(name,rules)
返回:undefined
增加組合驗證類型 在一個類裡
面用多種驗證方法裡比較有用
addClassRules(rules)
返回:undefined
增加組合驗證類型 在一個類
裡面用多種驗證方法裡比較有
用,這個是一下子加多個
內置驗證方式:
required()
返回:Boolean
必填驗證元素
required(dependency-expr
返回:Boolean
必填元素依賴於表達式的結果
required(dependency-callback)
返回:Boolean
必填元素依賴於回調函數的結果
remote(url)
返回:Boolean
請求遠程校驗。url通常是一個
遠程調用方法
minlength(length)
返回:Boolean
設置最小長度
maxlength(length)
返回:Boolean
設置最大長度
rangelength(range)
返回:Boolean
設置一個長度范圍[min,max]
min(value)
返回:Boolean
設置最大值
max(value)
返回:Boolean
設置最小值
email()
返回:Boolean
驗證電子郵箱格式
range(range)
返回:Boolean
設置值的范圍
url()
返回:Boolean
驗證URL格式
date()
返回:Boolean
驗證日期格式(類似30/30/2008的格式,不驗證日期准確性只驗證格式)
dateISO()
返回:Boolean
驗證ISO類型的日期格式
dateDE()
返回:Boolean
驗證德式的日期格式(29.04.1994 or 1.1.2006)
number()
返回:Boolean
驗證十進制數字(包括小數的)
digits()
返回:Boolean
驗證整數
creditcard()
返回:Boolean
驗證信用卡號
accept(extension)
返回:Boolean
驗證相同後綴名的字符串
equalTo(other)
返回:Boolean
驗證兩個輸入框的內容是否相同
phoneUS()
返回:Boolean
驗證美式的電話號碼
validate ()的可選項:
debug:進行調試模式(表單不提交):
$(".selector").validate
({
debug:true
})
把調試設置為默認:
$.validator.setDefaults({
debug:true
})
submitHandler:
通過驗證後運行的函數,裡面要加上表單提交的函數,否則表單不會提交
$(".selector").validate({
submitHandler:function(form) {
$(form).ajaxSubmit();
}
})
ignore:
對某些元素不進行驗證
$("#myform").validate({
ignore:".ignore"
})
rules:
自定義規則,key:value的形式,key是要驗證的元素,value可以是字符串或對象
$(".selector").validate({
rules:{
name:"required",
email:{
required:true,
email:true
}
}
})
messages:
自定義的提示信息key:value的形式key是要驗證的元素,值是字符串或函數
$(".selector").validate({
rules:{
name:"required",
email:{
required:true,
email:true
}
},
messages:{
name:"Name不能為空",
email:{
required:"E-mail不能為空",
email:"E-mail地址不正確"
}
}
})
groups:
對一組元素的驗證,用一個錯誤提示,用error Placement控制把出錯信息放在哪裡
$("#myform").validate({
groups:{
username:"fname lname"
},
errorPlacement:function(error,element) {
if (element.attr("name") == "fname" || element.attr("name") == "lname")
error.insertAfter("#lastname");
else
error.insertAfter(element);
},
debug:true
})
On
是否提交時驗證
$(".selector").validate({
on
})
on
是否在獲取焦點時驗證
$(".selector").validate({
on
})
on
是否在敲擊鍵盤時驗證
$(".selector").validate({
on
})
on
是否在鼠標點擊時驗證(一般驗證checkbox,radiobox)
$(".selector").validate({
on
})
focusInvalid Boolean 默認:true
提交表單後,未通過驗證的表單(第一個或提交之前獲得焦點的未通過驗證的表單)會獲得焦點
$(".selector").validate({
focusInvalid:false
})
focusCleanup Boolean 默認:false
當未通過驗證的元素獲得焦點時,並移除錯誤提示(避免和 focusInvalid.一起使用)
$(".selector").validate({
focusCleanup:true
})
errorClass String 默認:"error"
指定錯誤提示的css類名,可以自定義錯誤提示的樣式
$(".selector").validate({
errorClass:"invalid"
})
errorElement String 默認:"label"
使用什麼標簽標記錯誤
$(".selector").validate
errorElement:"em"
})
wrapper String
使用什麼標簽再把上邊的errorELement包起來
$(".selector").validate({
wrapper:"li"
})
errorLabelContainer Selector
把錯誤信息統一放在一個容器裡面
$("#myform").validate({
errorLabelContainer:"#messageBox",
wrapper:"li",
submitHandler:function() { alert("Submitted!") }
})
showErrors:
跟一個函數,可以顯示總共有多少個未通過驗證的元素
$(".selector").validate({
showErrors:function(errorMap,errorList) {
$("#summary").html("Your form contains " + this.numberOfInvalids() + " errors,see details below.");
this.defaultShowErrors();
}
})
errorPlacement:
跟一個函數,可以自定義錯誤放到哪裡
$("#myform").validate({
rrorPlacement:function(error,element) { error.appendTo(element.parent("td").next("td"));
},
debug:true
})
success:
要驗證的元素通過驗證後的動作,如果跟一個字符串,會當做一個css類,也可跟一個函數
$("#myform").validate({
success:"valid",
submitHandler:function() { alert("Submitted!") }
})
highlight:
可以給未通過驗證的元素加效果,閃爍等
addMethod(name,method,message)方法:
參數name是添加的方法的名字
參數method是一個函數,接收三個參數(value,element,param) value是元素的值,element是元素本身 param是參數,我們可以用addMethod來添加除built-in Validation methods之外的驗證方法 比如有一個字段,只能輸一個字母,范圍是a-f,寫法如下:
$.validator.addMethod("af",function(value,element,params){
if(value.length>1){
return false;
}
if(value>=params[0] && value<=params[1]){
return true;
}else{
return false;
}
},"必須是一個字母,且a-f");
用的時候,比如有個表單字段的id="username",則在rules中寫
username:{
af:["a","f"]
}
addMethod的第一個參數,就是添加的驗證方法的名子,這時是af
addMethod的第三個參數,就是自定義的錯誤提示,這裡的提示為:"必須是一個字母,且a-f"
addMethod的第二個參數,是一個函數,這個比較重要,決定了用這個驗證方法時的寫法
如果只有一個參數,直接寫,如果af:"a",那麼a就是這個唯一的參數,如果多個參數,用在[]裡,用逗號分開
meta String方式:
$("#myform").validate({
meta:"validate",
submitHandler:function() { alert("Submitted!") }
})
<script type="text/javas
<script type="text/javas
<form id="myform">
<input type="text" name="email" class="{validate:{ required:true,email:true }}" />
<input type="submit" value="Submit" />
</form>
validate.js中文api手冊
jQuery.validate.js+API_cn.pdf