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