凡要驗證格式的元素均需繫結datatype屬性,datatype可選值內建有10類,用來指定不同的驗證格式。
如果還不能滿足您的驗證需求,可以傳入自定義datatype,自定義datatype是乙個非常強大的功能,通過它可以滿足你的任何需求。
可以繫結的附加屬性有:datatype、nullmsg、sucmsg、errormsg、ignore、recheck、tip、altercss、ajaxurl 和 plugin等.
說明:內建基本的datatype型別有: * | *6-16 | n | n6-16 | s | s6-18 | p | m | e | url
*:檢測是否有輸入,可以輸入任何字元,不留空即可通過驗證;
*6-16:檢測是否為6到16位任意字元;
n:數字型別;
n6-16:6到16位數字;
s:字串型別;
s6-18:6到18位字串;
m:手機號碼格式;
e:email格式;
自定義datatype的名稱,可以由字母、數字、下劃線、中劃線和*號組成。
形如"6-16"的datatype,validform會自動擴充套件,可以指定任意的數值範圍。如內建基本型別有"6-16",那麼你繫結datatype="*4-12"就表示4到12位任意字元。如果你自定義了乙個datatype="zh2-4",表示2到4位中文字元,那麼datatype="zh2-6"就表示2到6位中文字元。
5.2版本之後,datatype支援規則累加或單選。用","分隔表示規則累加;用"|"分隔表示規則多選一,即只要符合其中乙個規則就可以通過驗證,繫結的規則會依次驗證,只要驗證通過,後面的規則就會忽略不再比較。如繫結datatype="m|e",表示既可以填寫手機號碼,也能填寫郵箱位址,如果知道填入的是手機號碼,那麼就不會再檢測他是不是郵箱位址;datatype="zh,s2-4",表示要符合自定義型別"zh",也要符合規則"s2-4"。
注:5.2.1版本之後,datatype支援:
直接繫結正則:如可用這樣寫datatype="/\w/i",要求是3到6位的字母,不區分大小寫;
支援簡單的邏輯運算:如datatype="m | e, *4-18 | /\w/i | /^validform.rjboy.cn$/",
這個表示式的意思是:可以是手機號碼;或者是郵箱位址,但字元長度必須在4到18位;或者是3到6位的字母,不區分大小寫;或者輸入validform.rjboy.cn,區分大小寫。這裡","分隔相當於邏輯運算裡的"&&"; "|"分隔相當於邏輯運算裡的"||";不支援括號運算。
nullmsg
當表單元素值為空時的提示資訊,不繫結,預設提示"請填入資訊!"。
如:nullmsg="請填寫使用者名稱!"
5.3版開始,對於沒有繫結nullmsg的物件,會自動查詢class為validform_label下的文字作為提示文字:
如這樣的html結構:
*使用者名稱:
當這個文字框裡沒有輸入時的出錯資訊就會是:"請輸入使用者名稱!"
這裡validform_label跟input之間的位置關係,不一定是要同級關係,同級裡沒有找到的話,它還會在同級的子級、父級的同級、父級的同級的子級裡查詢。
sucmsg 5.3+
當表單元素通過驗證時的提示資訊,不繫結,預設提示"通過資訊驗證!"。
如:sucmsg="使用者名稱還未被使用,可以註冊!"
5.3版開始,也可以在實時驗證返回的json資料裡返回成功的提示文字,請檢視附加屬性ajaxurl的介紹。
errormsg
輸入內容不能通過驗證時的提示資訊,預設提示"請輸入正確資訊!"。
如:errormsg="使用者名稱必須是2到4位中文字元!"
5.3版開始,validform可以根據你繫結的datatype智慧型的輸出相應出錯資訊,具體介紹請檢視tipmsg
ignore
繫結了ignore="ignore"的表單元素,在有輸入時,會驗證所填資料是否符合datatype所指定資料型別,
沒有填寫內容時則會忽略對它的驗證;
recheck
表單裡面經常需要檢查兩次密碼輸入是否一致,recheck就是用來指定需要比較的另外乙個表單元素。
如:recheck="password1",那麼它就會拿當前元素的值跟該表單下,name為"password1"的元素比較。
tip表單裡經常有些文字框需要預設就顯示乙個灰色的提示文字,當獲得焦點時提示文字消失,失去焦點時提示文字顯示。tip屬性就是用來實現這個效果。它通常和altercss搭配使用。
如altercss
它需要和tip屬性配合使用,altercss指定的樣式名,會在文字框獲得焦點時被刪除,沒有輸入內容而失去焦點時重新加上。
ajaxurl
指定ajax實時驗證的後台檔案的位址。
後台頁面如valid.php檔案中可以用 $_post["param"] 接收到值,ajax中會post過來變數param和name。param是文字框的值,name是文字框的name屬性。
5.2版本開始,可以在ajaxurl指定的url後繫結引數,如:
ajaxurl="valid.php?myparam1=value1&myparam2=value2";
5.3之前的版本中,該檔案輸出的字元會作為錯誤資訊顯示在頁面上,如果驗證通過需輸出小寫字母"y"。
在5.3版中,實時驗證的返回資料做了調整,須是含有status值的json資料!跟callback裡的ajax返回資料格式統一,建議不再返回字串"y"或"n"。目前這兩種格式的資料都相容。
注:如果ajax校驗通過,會在該元素上繫結validform_valid值為true。可以通過設定該值來控制驗證能不能通過,如驗證碼的驗證,第一次驗證通過後,不小心右點選了下驗證碼,驗證碼換了,但是仍然指示這個物件已經通過了驗證,這時可以手動調整該值:$("#name")[0].validform_valid="false"。
怎樣設定ajax的引數,具體可以檢視validform物件的config方法。
jQuery之Validate表單校驗外掛程式
目錄 validate表單校驗 步驟 1.匯入jquery外掛程式 2.匯入validate外掛程式 3.匯入validate中文提示外掛程式 3.在頁面載入成功之後,對表單進行校驗 4.在validate中編寫校驗規則 模板 校驗器規則 validate 外掛程式為表單提供了強大的驗證功能,讓客戶...
jQuery表單校驗
formid validate 需要錄入的另一種寫法 ublog 需要輸入,且錄入的必須是url messages submithandler function form 閱讀一下文件差不多就會了解,支援的校驗格式有 required 必填字段 email 電子郵件 url 合法的 date 日期 ...
AngularJs 表單校驗
angularjs實現了資料雙向繫結,改變了html格局下需手寫大段js來處理動態資料問題。不能為空 長度不足3位 已存在其中ng submit表示表單的提交方法為processform 而required用於非空校驗 ng minlength用於最短長度校驗 name validation則是自定...