FormValidate 表单验证功能代码更新并提供下载

  FormValidate 功能更新

  下载:

  http://xiazai.glzy8.com/jslib/FormValidate.rar

  更多用法,可参才:

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

  加入方法:

  extend,

  加入验证模式 4,同3,但是当验证不通过时,立即停止向下检查。在模式3下,如果发生错误,会把错误记录,并向下检查,模式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:"语文分数是必须项,必须大于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则不存这个问题。