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


Posted in Javascript onAugust 23, 2008

FormValidate 功能更新

下载:
http://xiazai.3water.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则不存这个问题。

Javascript 相关文章推荐
JavaScript面向对象之Prototypes和继承
Jul 12 Javascript
jQuery中prepend()方法使用详解
Aug 11 Javascript
第七章之菜单按钮图标组件
Apr 25 Javascript
移动开发之自适应手机屏幕宽度
Nov 23 Javascript
微信小程序表单验证错误提示效果
May 19 Javascript
使用axios实现上传图片进度条功能
Dec 21 Javascript
Angular 4.x+Ionic3踩坑之Ionic 3.x界面传值详解
Mar 13 Javascript
快速解决vue-cli在ie9+中无效的问题
Sep 04 Javascript
vue实现固定位置显示功能
May 30 Javascript
解决微信小程序scroll-view组件无横向滚动的问题
Feb 04 Javascript
如何在node环境实现“get数据解析”代码实例
Jul 03 Javascript
vue中this.$http.post()跨域和请求参数丢失的解决
Apr 08 Vue.js
Javascript 篱式条件判断
Aug 22 #Javascript
解决AJAX中跨域访问出现'没有权限'的错误
Aug 20 #Javascript
javascript:void(0)的真正含义实例分析
Aug 20 #Javascript
利用404错误页面实现UrlRewrite的实现代码
Aug 20 #Javascript
一些不错的js函数ajax
Aug 20 #Javascript
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
Aug 14 #Javascript
jquery之Document元素选择器篇
Aug 14 #Javascript
You might like
javascript引用对象的方法代码
2007/08/13 Javascript
图片格式的JavaScript和CSS速查手册
2007/08/20 Javascript
Javascript 对象的解释
2008/11/24 Javascript
读jQuery之十一 添加事件核心方法
2011/07/31 Javascript
基于jQuery选择器的整理集合
2013/04/26 Javascript
Nodejs进程管理模块forever详解
2014/06/01 NodeJs
node.js 中国天气预报 简单实现
2016/06/06 Javascript
jQuery实现字符串全部替换的方法
2016/12/12 Javascript
xmlplus组件设计系列之图标(ICON)(1)
2017/05/05 Javascript
layer弹出子iframe层父子页面传值的实现方法
2018/11/22 Javascript
JS实现处理时间,年月日,星期的公共方法示例
2019/05/31 Javascript
jQuery实现提交表单时不提交隐藏div中input的方法
2019/10/08 jQuery
详解ES6 中的Object.assign()的用法实例代码
2021/01/11 Javascript
python3序列化与反序列化用法实例
2015/05/26 Python
20招让你的Python飞起来!
2016/09/27 Python
Pycharm学习教程(4) Python解释器的相关配置
2017/05/03 Python
用Python实现随机森林算法的示例
2017/08/24 Python
Python使用SQLite和Excel操作进行数据分析
2018/01/20 Python
Python内置函数reversed()用法分析
2018/03/20 Python
django一对多模型以及如何在前端实现详解
2019/07/24 Python
opencv3/C++图像像素操作详解
2019/12/10 Python
Python3 获取文件属性的方式(时间、大小等)
2020/03/12 Python
CSS3使用transition实现的鼠标悬停淡入淡出
2015/01/09 HTML / CSS
德国健康生活方式网上商店:Landkaufhaus Mayer
2019/03/12 全球购物
几个常见的软件测试问题
2016/09/07 面试题
读书心得体会
2013/12/28 职场文书
工会主席事迹材料
2014/06/03 职场文书
消防工作实施方案
2014/06/09 职场文书
无房产证房屋转让协议书合同样本
2014/10/18 职场文书
党政领导班子群众路线对照检查材料
2014/10/26 职场文书
初中教师个人工作总结
2015/02/10 职场文书
让生命充满爱观后感
2015/06/08 职场文书
演讲比赛通讯稿
2015/07/18 职场文书
家电创业计划书
2019/08/05 职场文书
CSS3 实现NES游戏机的示例代码
2021/04/21 HTML / CSS
idea下配置tomcat避坑详解
2022/04/12 Servers