FormValidate表單驗證功能代碼更新并提供下載_javascript技巧

下載：
http://xiazai.jb51.net/jslib/FormValidate.rar

更多用法，可參才：

http://jobj.googlecode.com/svn/trunk/FormValidate/demo.html

加入方法：
extend，
加入驗證模式 4,同3,但是當驗證不通過時，立即停止向下檢查。在模式3下，如果發生錯誤，會把錯誤記錄，并向下檢查，模式4就不向下檢查了。

用法：

。。。
。。。
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:"語文分數是必須項，必須大于0小于100"},
{name:"scoreB[0]", required:true, type:"Num", min:0, max:100, msg:"數學分數是必須項，必須大于0小于100"},
{name:"scoreC[0]", required:true, type:"Num", min:0, max:100, msg:"英語分數是必須項，必須大于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);

解釋：
為啥要這樣寫？
如果不動態添加表單項，可以把 va.extend這一句刪除。但是動態添加表單項的話。。新增的表單項無法指定。
這樣寫，就是跟據 ruleTpl 所指定的為驗證規則。這個 ruleTpl可以是任何字符串（不是它的值），比如，如果把 ruleTpl換成 ttt,那么就要寫成：
va.extend(document.forms[0],'ttt',checkRule)
ruleTpl 是做為表單項的一個自定義 attribute 存在的，其值必須是 checkRule 的一個下標，如果這個下標不存，則默認不檢查這一項。否則就把選定的 checkRule的元素復制一遍，達到動態添加驗證規則的目的。

在添加這個功能的時候，遇到幾個有趣的問題，下面我說說：

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] 的值改變了。

下面這一段就很簡單了，值引用，不會發生上面的情況。

var a = [1,2,3];
a.push(a[a.length - 1]);
alert(a);
a[a.length - 1] = 4;
alert(a);
2，FF下動態刪除表單項。
如果動態刪除了某個表單項，不 alert 的話， form['itemName']還是那個被刪除的 表單項。
這時，它的 parentNode,form 都為 null,但是卻不能用 parentNode == null 來判斷，不知道為啥，FF真是另人***，為了完成功能，只好用 item.form == null來判斷，如：

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

IE則不存這個問題。

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com