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 相关文章推荐
JS实现在Repeater控件中创建可隐藏区域的代码
Sep 16 Javascript
javascript如何判断输入的url是否正确
Apr 11 Javascript
javascript实现获取cookie过期时间的变通方法
Aug 14 Javascript
jquery事件preventDefault()方法用法实例
Jan 16 Javascript
封装好的一个万能检测表单的方法
Jan 21 Javascript
JavaScript SHA1加密算法实现详细代码
Oct 06 Javascript
Bootstrap 树控件使用经验分享(图文解说)
Nov 06 Javascript
Angular实现搜索框及价格上下限功能
Jan 19 Javascript
vue-cli3项目展示本地Markdown文件的方法
Jun 07 Javascript
layui 表格操作列按钮动态显示的实现方法
Sep 06 Javascript
vue中的双向数据绑定原理与常见操作技巧详解
Mar 16 Javascript
原生JS实现分页
Apr 19 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
PHP5下$_SERVER变量不再受magic_quotes_gpc保护的弥补方法
2012/10/31 PHP
hadoop中一些常用的命令介绍
2013/06/19 PHP
PHP实现将科学计数法转换为原始数字字符串的方法
2014/12/16 PHP
Apache启动报错No space left on device: AH00023该怎么解决
2015/10/16 PHP
Javascript 构造函数,公有,私有特权和静态成员定义方法
2009/11/30 Javascript
js不能跳转到上一页面的问题解决方法
2013/03/01 Javascript
jquery对象和DOM对象的区别介绍
2013/08/09 Javascript
用JS将搜索的关键字高亮显示实现代码
2013/11/08 Javascript
使用javascript实现Iframe自适应高度
2014/12/24 Javascript
用JavaScript实现PHP的urlencode与urldecode函数
2015/08/13 Javascript
JavaScript简单实现鼠标移动切换图片的方法
2016/02/23 Javascript
AngularJs  E2E Testing 详解
2016/09/02 Javascript
vue-ajax小封装实例
2017/09/18 Javascript
使用webpack打包koa2 框架app
2018/02/02 Javascript
微信小程序支付功能 php后台对接完整代码分享
2018/06/12 Javascript
Vue使用vue-area-linkage实现地址三级联动效果的示例
2018/06/27 Javascript
微信小程序引用iconfont图标的方法
2018/10/22 Javascript
小程序rich-text组件如何改变内部img图片样式的方法
2019/05/22 Javascript
浅谈React中组件逻辑复用的那些事儿
2020/05/21 Javascript
[40:03]Liquid vs Optic 2018国际邀请赛淘汰赛BO3 第一场 8.21
2018/08/22 DOTA
python黑魔法之编码转换
2016/01/25 Python
python实现学生信息管理系统
2020/04/05 Python
Django接收自定义http header过程详解
2019/08/23 Python
解决pycharm启动后总是不停的updating indices...indexing的问题
2019/11/27 Python
python实现字典嵌套列表取值
2019/12/16 Python
python opencv 检测移动物体并截图保存实例
2020/03/10 Python
Django 多对多字段的更新和插入数据实例
2020/03/31 Python
PyCharm2019 安装和配置教程详解附激活码
2020/07/31 Python
雷蛇美国官网:Razer
2020/04/03 全球购物
SQL Server数据库笔试题和答案
2016/02/04 面试题
美术师范毕业生自荐信
2013/11/16 职场文书
领导党性分析材料
2014/02/15 职场文书
大学军训的体会
2014/11/08 职场文书
农村老人去世追悼词
2015/06/23 职场文书
各国货币符号大全
2022/02/17 杂记
Java对文件的读写操作方法
2022/04/29 Java/Android