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 相关文章推荐
学习YUI.Ext 第二天
Mar 10 Javascript
JavaScript 检测浏览器和操作系统的脚本
Dec 26 Javascript
JQuery自适应IFrame高度(支持嵌套 兼容IE,ff,safafi,chrome)
Mar 28 Javascript
JQuery onload、ready概念介绍及使用方法
Apr 27 Javascript
jQuery实现页面内锚点平滑跳转特效的方法总结
May 11 Javascript
JS转换HTML转义符的方法
Aug 24 Javascript
connection reset by peer问题总结及解决方案
Oct 21 Javascript
Vue开发过程中遇到的疑惑知识点总结
Jan 20 Javascript
详解如何使用webpack打包Vue工程
May 27 Javascript
详解node服务器中打开html文件的两种方法
Sep 18 Javascript
vue祖孙组件之间的数据传递案例
Dec 07 Vue.js
JavaScript小技巧带你提升你的代码技能
Sep 15 Javascript
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
PHP遍历某个目录下的所有文件和子文件夹的实现代码
2013/06/28 PHP
一个图片地址分解程序(用于PHP小偷程序)
2014/08/23 PHP
开启PHP Static 关键字之旅模式
2015/11/13 PHP
php封装的验证码类分享
2017/02/26 PHP
php制作圆形用户头像的实例_自定义封装类源代码
2017/09/18 PHP
Discuz不使用插件实现简单的打赏功能
2019/03/21 PHP
简单的JS多重继承示例
2008/03/13 Javascript
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
2008/08/14 Javascript
window.onload 加载完毕的问题及解决方案(下)
2009/07/09 Javascript
js中的如何定位固定层的位置
2014/06/15 Javascript
jQuery EasyUI datagrid实现本地分页的方法
2015/02/13 Javascript
JavaScript实现LI列表数据绑定的方法
2015/08/04 Javascript
JS响应鼠标点击实现两个滑块区间拖动效果
2015/10/26 Javascript
Node.js DES加密的简单实现
2016/07/07 Javascript
网站发布后Bootstrap框架引用woff字体无法正常显示的解决方法
2016/11/24 Javascript
bootstrap实现动态进度条效果
2017/03/08 Javascript
完美实现js选项卡切换效果(二)
2017/03/08 Javascript
vue 请求后台数据的实例代码
2017/06/22 Javascript
JS 数组随机洗牌的实例代码
2018/09/12 Javascript
了解JavaScript表单操作和表单域
2019/05/27 Javascript
使用 js 简单的实现 bind、call 、aplly代码实例
2019/09/07 Javascript
[57:37]EG vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
使用Python抓取模板之家的CSS模板
2015/03/16 Python
TensorFlow如何实现反向传播
2018/02/06 Python
python 多线程中子线程和主线程相互通信方法
2018/11/09 Python
在Python中关于使用os模块遍历目录的实现方法
2019/01/03 Python
pyqt5 禁止窗口最大化和禁止窗口拉伸的方法
2019/06/18 Python
python matplotlib中的subplot函数使用详解
2020/01/19 Python
在 Pycharm 安装使用black的方法详解
2020/04/02 Python
Python使用xlrd实现读取合并单元格
2020/07/09 Python
Autopep8的使用(python自动编排工具)
2021/03/02 Python
广告学专业自荐信范文
2014/02/24 职场文书
护理专业学生职业生涯规划范文
2014/03/11 职场文书
社团活动总结怎么写
2014/06/30 职场文书
副检察长四风问题对照检查材料思想汇报
2014/10/07 职场文书
六一文艺汇演主持词
2015/06/30 职场文书