FormValidate 表單驗證功能代碼更新并提供下載
更新時間:2008年08月23日 08:33:31 作者:
加入驗證模式 4,同3,但是當(dāng)驗證不通過時,立即停止向下檢查。在模式3下,如果發(fā)生錯誤,會把錯誤記錄,并向下檢查,模式4就不向下檢查了
FormValidate 功能更新
下載:
http://xiazai.jb51.net/jslib/FormValidate.rar
更多用法,可參才:
http://jobj.googlecode.com/svn/trunk/FormValidate/demo.html
加入方法:
extend,
加入驗證模式 4,同3,但是當(dāng)驗證不通過時,立即停止向下檢查。在模式3下,如果發(fā)生錯誤,會把錯誤記錄,并向下檢查,模式4就不向下檢查了。
用法:
<input type="text" name="name[0]" id="name[0]" ruleTpl="0" />
<input type="text" name="birthday[0]" id="birthday[0]" ruleTpl="1" />
。。。。。
。。。。。
var checkRule = [
{name:"name[0]", required:true, min:2, max:3, msg:"請輸入姓名!長度必須大于2,小于3"},
{name:"birthday[0]",required:false, type:"Date", msg:"出生日期是可選項,如果輸入,請輸入正確的日期"},
{name:"email[0]", required:false, type:"Email", msg:"郵件是可選項,如果輸入,請輸入正確的郵件地址"},
{name:"scoreA[0]", required:true, type:"Num", min:0, max:100, msg:"語文分?jǐn)?shù)是必須項,必須大于0小于100"},
{name:"scoreB[0]", required:true, type:"Num", min:0, max:100, msg:"數(shù)學(xué)分?jǐn)?shù)是必須項,必須大于0小于100"},
{name:"scoreC[0]", required:true, type:"Num", min:0, max:100, msg:"英語分?jǐn)?shù)是必須項,必須大于0小于100"}
];
JObj.plugin("FormValidate");
var va = JObj.Plugin.FormValidate;
va.extend(document.forms[0],"ruleTpl",checkRule);
return va.validate(document.forms[0],checkRule,4);
解釋:
為啥要這樣寫?
如果不動態(tài)添加表單項,可以把 va.extend這一句刪除。但是動態(tài)添加表單項的話。。。新增的表單項無法指定。
這樣寫,就是跟據(jù) ruleTpl 所指定的為驗證規(guī)則。這個 ruleTpl可以是任何字符串(不是它的值),比如,如果把 ruleTpl換成 ttt,那么就要寫成:
va.extend(document.forms[0],'ttt',checkRule)
ruleTpl 是做為表單項的一個自定義 attribute 存在的,其值必須是 checkRule 的一個下標(biāo),如果這個下標(biāo)不存,則默認(rèn)不檢查這一項。否則就把選定的 checkRule的元素復(fù)制一遍,達(dá)到動態(tài)添加驗證規(guī)則的目的。
在添加這個功能的時候,遇到幾個有趣的問題,下面我說說:
1,地址引用,請不要運行,說出下面代碼中,變量 a 的值。
var a = [{name:1}];
var tmp = a.push(a[a.length - 1]);
a[tmp - 1].name = 2;
如果你說:a = [{name:1},{name:2}],那你就大錯特錯了,真實值是:
a = [{name:2},{name:2}];
原因很簡單,因為 push的是一個對象,對象在JS里是地址引用,所以, a[tmp - 1].name = 2 的時候,其實是把 a[0] 的值改變了。
下面這一段就很簡單了,值引用,不會發(fā)生上面的情況。
var a = [1,2,3];
a.push(a[a.length - 1]);
alert(a);
a[a.length - 1] = 4;
alert(a);
2,F(xiàn)F下動態(tài)刪除表單項。
如果動態(tài)刪除了某個表單項,不 alert 的話, form['itemName']還是那個被刪除的 表單項。
這時,它的 parentNode,form 都為 null,但是卻不能用 parentNode == null 來判斷,不知道為啥,F(xiàn)F真是另人***,為了完成功能,只好用 item.form == null來判斷,如:
if (obj == undefined || obj.form == null) return null;
IE則不存這個問題。
下載:
http://xiazai.jb51.net/jslib/FormValidate.rar
更多用法,可參才:
http://jobj.googlecode.com/svn/trunk/FormValidate/demo.html
加入方法:
extend,
加入驗證模式 4,同3,但是當(dāng)驗證不通過時,立即停止向下檢查。在模式3下,如果發(fā)生錯誤,會把錯誤記錄,并向下檢查,模式4就不向下檢查了。
用法:
<input type="text" name="name[0]" id="name[0]" ruleTpl="0" />
<input type="text" name="birthday[0]" id="birthday[0]" ruleTpl="1" />
。。。。。
。。。。。
var checkRule = [
{name:"name[0]", required:true, min:2, max:3, msg:"請輸入姓名!長度必須大于2,小于3"},
{name:"birthday[0]",required:false, type:"Date", msg:"出生日期是可選項,如果輸入,請輸入正確的日期"},
{name:"email[0]", required:false, type:"Email", msg:"郵件是可選項,如果輸入,請輸入正確的郵件地址"},
{name:"scoreA[0]", required:true, type:"Num", min:0, max:100, msg:"語文分?jǐn)?shù)是必須項,必須大于0小于100"},
{name:"scoreB[0]", required:true, type:"Num", min:0, max:100, msg:"數(shù)學(xué)分?jǐn)?shù)是必須項,必須大于0小于100"},
{name:"scoreC[0]", required:true, type:"Num", min:0, max:100, msg:"英語分?jǐn)?shù)是必須項,必須大于0小于100"}
];
JObj.plugin("FormValidate");
var va = JObj.Plugin.FormValidate;
va.extend(document.forms[0],"ruleTpl",checkRule);
return va.validate(document.forms[0],checkRule,4);
解釋:
為啥要這樣寫?
如果不動態(tài)添加表單項,可以把 va.extend這一句刪除。但是動態(tài)添加表單項的話。。。新增的表單項無法指定。
這樣寫,就是跟據(jù) ruleTpl 所指定的為驗證規(guī)則。這個 ruleTpl可以是任何字符串(不是它的值),比如,如果把 ruleTpl換成 ttt,那么就要寫成:
va.extend(document.forms[0],'ttt',checkRule)
ruleTpl 是做為表單項的一個自定義 attribute 存在的,其值必須是 checkRule 的一個下標(biāo),如果這個下標(biāo)不存,則默認(rèn)不檢查這一項。否則就把選定的 checkRule的元素復(fù)制一遍,達(dá)到動態(tài)添加驗證規(guī)則的目的。
在添加這個功能的時候,遇到幾個有趣的問題,下面我說說:
1,地址引用,請不要運行,說出下面代碼中,變量 a 的值。
var a = [{name:1}];
var tmp = a.push(a[a.length - 1]);
a[tmp - 1].name = 2;
如果你說:a = [{name:1},{name:2}],那你就大錯特錯了,真實值是:
a = [{name:2},{name:2}];
原因很簡單,因為 push的是一個對象,對象在JS里是地址引用,所以, a[tmp - 1].name = 2 的時候,其實是把 a[0] 的值改變了。
下面這一段就很簡單了,值引用,不會發(fā)生上面的情況。
var a = [1,2,3];
a.push(a[a.length - 1]);
alert(a);
a[a.length - 1] = 4;
alert(a);
2,F(xiàn)F下動態(tài)刪除表單項。
如果動態(tài)刪除了某個表單項,不 alert 的話, form['itemName']還是那個被刪除的 表單項。
這時,它的 parentNode,form 都為 null,但是卻不能用 parentNode == null 來判斷,不知道為啥,F(xiàn)F真是另人***,為了完成功能,只好用 item.form == null來判斷,如:
if (obj == undefined || obj.form == null) return null;
IE則不存這個問題。
您可能感興趣的文章:
- jValidate 基于jQuery的表單驗證插件
- jquery validate.js表單驗證的基本用法入門
- 使用jQuery validate 驗證注冊表單實例演示
- jquery內(nèi)置驗證(validate)使用方法示例(表單驗證)
- 基于Bootstrap+jQuery.validate實現(xiàn)Form表單驗證
- jquery表單驗證插件(jquery.validate.js)的3種使用方式
- jquery validate和jquery form 插件組合實現(xiàn)驗證表單后AJAX提交
- jquery validate.js表單驗證入門實例(附源碼)
- 實例詳解jQuery表單驗證插件validate
相關(guān)文章
JavaScript獲取網(wǎng)頁表單action屬性的方法
這篇文章主要介紹了JavaScript獲取網(wǎng)頁表單action屬性的方法,涉及javascript操作表單屬性的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-04-04
JavaScript躲避行星游戲?qū)崿F(xiàn)全程
本文將使用 canvas 創(chuàng)建一個躲避小行星游戲。另外將重點介紹的兩個方面是:如何使用 JavaScript 來檢測鍵盤輸入,以及如何在游戲中使用和處理 HTML5 音頻。希望你能夠喜歡2022-08-08
js+springMVC 提交數(shù)組數(shù)據(jù)到后臺的實例
今天小編就為大家分享一篇js+springMVC 提交數(shù)組數(shù)據(jù)到后臺的實例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
兩種方法實現(xiàn)在HTML頁面加載完畢后運行某個js
這篇文章主要介紹了通過兩種方法實現(xiàn)在HTML頁面加載完畢后運行某個js,需要的朋友可以參考下
2014-06-06 
