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:"語文分數(shù)是必須項,必須大于0小于100"},
{name:"scoreB[0]", required:true, type:"Num", min:0, max:100, msg:"數(shù)學(xué)分數(shù)是必須項,必須大于0小于100"},
{name:"scoreC[0]", required:true, type:"Num", min:0, max:100, msg:"英語分數(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 的一個下標,如果這個下標不存,則默認不檢查這一項。否則就把選定的 checkRule的元素復(fù)制一遍,達到動態(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:"語文分數(shù)是必須項,必須大于0小于100"},
{name:"scoreB[0]", required:true, type:"Num", min:0, max:100, msg:"數(shù)學(xué)分數(shù)是必須項,必須大于0小于100"},
{name:"scoreC[0]", required:true, type:"Num", min:0, max:100, msg:"英語分數(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 的一個下標,如果這個下標不存,則默認不檢查這一項。否則就把選定的 checkRule的元素復(fù)制一遍,達到動態(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)文章
js實現(xiàn)仿Windows風(fēng)格選項卡和按鈕效果實例
這篇文章主要介紹了js實現(xiàn)仿Windows風(fēng)格選項卡和按鈕效果的方法,可實現(xiàn)類似windows選項卡風(fēng)格的tab標簽效果,需要的朋友可以參考下2015-05-05JavaScript中 ES6變量的結(jié)構(gòu)賦值
這篇文章主要介紹了JS 中ES6變量的結(jié)構(gòu)賦值的相關(guān)資料,非常不錯,具有一定的參考借鑒價值,需要的朋友可以參考下2018-07-07如何讓動態(tài)插入的javascript腳本代碼跑起來。
如何讓動態(tài)插入的javascript腳本代碼跑起來。...2007-01-01echarts圖表設(shè)置寬度100%結(jié)果為100px的解決辦法
在開發(fā)一個前端項目時需要用到Element-ui的el-tabs組件和Echart開源庫,當(dāng)兩者嵌套使用時,我給Echart中的圖表寬度設(shè)置為了100%,但是實際的寬度卻只有100px,這篇文章主要給大家介紹了關(guān)于echarts圖表設(shè)置寬度100%結(jié)果為100px的解決辦法,需要的朋友可以參考下2022-12-12javascript 獲取多條數(shù)據(jù)(模擬ajax獲取數(shù)據(jù))
javascript 獲取多條數(shù)據(jù)(模擬ajax獲取數(shù)據(jù)),這樣的好處不用額外的ajax讀取鏈接,減輕服務(wù)器負擔(dān)。2009-06-06