JQuery表单验证插件EasyValidator用法分析


Posted in Javascript onNovember 15, 2014

本文实例讲述了JQuery表单验证插件EasyValidator用法。分享给大家供大家参考。具体如下:

本插件的宗旨是:用户无需写一行JS验证代码,只需在要验证的表单中加入相应的验证属性即可,让验证功能易维护,可扩展,更容易上手。

DEMO中已经包含了常用的正则表达式,可以直接复用,为了考虑扩展性,所以针对不同用户特殊需求,自行写正则吧。

EasyValidator实现的功能:

1.提示功能(在表单或者其他标签中加入tip="想提示的文字")

如:

<input name="name" tip="请输入你的名字哟~">

或者

<a href="http://wangking717.iteye.com/blog/769021" tip="到EasyValidator官方主页来" target="_blank">有疑惑可以到这里提问</a>

2. 普通表单验证(在表单中加入reg="正则表达式")
如:

<input name="username" reg="正则" />

普通表单验证DEMO:http://easyvalidator.googlecode.com/svn/trunk/index.html

3. AJAX表单验证(在表单中加入url="验证系统地址")
如:

<input name="username" url="地址" />

AJAX验证DEMO:没有在线演示,请在本地运行ajax_demo.html,请求远程的PHP文件,当然可以为JSP或者ASP,我这里在程序里预设了一些已存在的数据,用户可以自行参考。

4. 普通表单验证 +  AJAX表单验证 (普通验证通过以后,再进行AJAX验证)
如:

<input name="username" reg="正则" url="地址" />

5. 扩展函数表单验证(某些业务特殊需求):

这些特殊需求都是根据业务来的,这里列举一下这样的情况:

1.checkbox选择框数量验证,如限制别人至少选择1个,最多选择5个checkbox。
2.多个表单之间进行比较,如【开始时间表单】一定小于等于【结束时间表单】或者两个密码表单要相等,用于注册的时候,等等。

由于这种情况的特殊性,所以用户得自己写业务逻辑代码,官方已经提供了extendsValidate扩展函数,在里面写自己的逻辑代码即可。

扩展函数表单验证DEMO:http://easyvalidator.googlecode.com/svn/trunk/extends_demo.html

JQuery表单验证插件EasyValidator用法分析

BUG修复日志:
2010-9-24 : 修复同一页多个FORM提交BUG ,TIP错位BUG
2010-9-26 : 新增bgiframe插件, 修复IE6下TIP 遮罩不了 SELECT表单
2010-9-27 : 增加扩展API,并重构核心库

2011-1-1   : 将表单验证的TIP独立出来,让TIP,URL,REG成为单独的组建而存在,更加灵活!

2011-1-28 : 修改了AJAX的TIP纠错BUG,逻辑修改,并且将AJAX的请求的远程程序validate_user.php的编码设置GB2312。

官方下载地址:http://code.google.com/p/easyvalidator/downloads/list

或者点击此处本站下载。https://3water.com/jiaoben/32303.html

在线正则验证器:http://regexpal.com/

希望本文所述对大家的web程序设计有所帮助。

Javascript 相关文章推荐
javascript form 验证函数 弹出对话框形式
Jun 23 Javascript
前台js对象在后台转化java对象的问题探讨
Dec 20 Javascript
js实现的map方法示例代码
Jan 13 Javascript
JS回调函数的应用简单实例
Sep 17 Javascript
jquery图片滚动放大代码分享(2)
Aug 28 Javascript
js实现遍历含有input的table实例
Dec 07 Javascript
Java遍历集合方法分析(实现原理、算法性能、适用场合)
Apr 25 Javascript
一分钟理解js闭包
May 04 Javascript
浅谈angularjs中响应回车事件
Apr 24 Javascript
vue服务端渲染操作简单入门实例分析
Aug 28 Javascript
vue 自动化路由实现代码
Sep 03 Javascript
js 闭包深入理解与实例分析
Mar 19 Javascript
不到30行JS代码实现Excel表格的方法
Nov 15 #Javascript
Node.js中HTTP模块与事件模块详解
Nov 14 #Javascript
jquery中append()与appendto()用法分析
Nov 14 #Javascript
jQuery 插件开发指南
Nov 14 #Javascript
使用JavaScript和C#中获得referer
Nov 14 #Javascript
JavaScript window.location对象
Nov 14 #Javascript
详谈JavaScript 匿名函数及闭包
Nov 14 #Javascript
You might like
PHP定时自动生成静态HTML的实现代码
2010/06/20 PHP
基于PHP遍历数组的方法汇总分析
2013/06/08 PHP
详解Yii2 之 生成 URL 的方法
2017/06/16 PHP
PHP中使用jQuery+Ajax实现分页查询多功能操作(示例讲解)
2017/09/17 PHP
PHP实现的最大正向匹配算法示例
2017/12/19 PHP
laravel框架数据库配置及操作数据库示例
2019/10/10 PHP
jQuery 使用手册(一)
2009/09/23 Javascript
javascript的offset、client、scroll使用方法详解
2012/12/25 Javascript
JQuery加载图片自适应固定大小的DIV
2013/09/12 Javascript
node.js中的url.format方法使用说明
2014/12/10 Javascript
JavaScript中的原型prototype属性使用详解
2015/06/05 Javascript
javascript表单控件实例讲解
2016/09/13 Javascript
angular实现IM聊天图片发送实例
2017/05/08 Javascript
详解vue项目的构建,打包,发布全过程
2017/11/23 Javascript
vue2中引用及使用 better-scroll的方法详解
2018/11/15 Javascript
如何自动化部署项目?折腾服务器之旅~
2019/04/16 Javascript
React+Redux实现简单的待办事项列表ToDoList
2019/09/29 Javascript
Vuex,iView UI面包屑导航使用扩展详解
2019/11/04 Javascript
[32:26]EG vs IG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
举例讲解Python的lambda语句声明匿名函数的用法
2016/07/01 Python
python 二维数组90度旋转的方法
2019/01/28 Python
强悍的Python读取大文件的解决方案
2019/02/16 Python
python钉钉机器人运维脚本监控实例
2019/02/20 Python
怎样在程序里获得一个空指针
2015/01/24 面试题
无毒社区工作方案
2014/05/23 职场文书
销售顾问工作计划书
2014/08/15 职场文书
财政局党的群众路线教育实践活动整改方案
2014/09/21 职场文书
领导党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
安全月宣传标语
2014/10/07 职场文书
2014年党员整改措施
2014/10/24 职场文书
个人工作总结范文2014
2014/11/07 职场文书
常务副总经理岗位职责
2015/02/02 职场文书
2015年小学数学教师工作总结
2015/05/20 职场文书
政审证明材料
2015/06/19 职场文书
工作违纪的检讨书范文
2019/07/09 职场文书
喜迎建国70周年:有关爱国的名言名句
2019/09/24 职场文书