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)證不通過時(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);

解釋：
為啥要這樣寫？
如果不動(dòng)態(tài)添加表單項(xiàng)，可以把 va.extend這一句刪除。但是動(dòng)態(tài)添加表單項(xiàng)的話。。。新增的表單項(xiàng)無法指定。
這樣寫，就是跟據(jù) ruleTpl 所指定的為驗(yàn)證規(guī)則。這個(gè) ruleTpl可以是任何字符串（不是它的值），比如，如果把 ruleTpl換成 ttt,那么就要寫成：
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è)有趣的問題，下面我說說：

1，地址引用，請(qǐng)不要運(yùn)行，說出下面代碼中，變量 a 的值。

var a = [{name:1}];
var tmp = a.push(a[a.length - 1]);
a[tmp - 1].name = 2;
如果你說：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 的話， form['itemName']還是那個(gè)被刪除的 表單項(xiàng)。
這時(shí)，它的 parentNode,form 都為 null,但是卻不能用 parentNode == null 來判斷，不知道為啥，F(xiàn)F真是另人***，為了完成功能，只好用 item.form == null來判斷，如：

if (obj == undefined || obj.form == null) return null;

IE則不存這個(gè)問題。

最新評(píng)論