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 相关文章推荐
Extjs 几个方法的讨论
Jan 28 Javascript
JavaScript中为元素加上name属性的方法
May 09 Javascript
js关闭子窗体刷新父窗体实现方法
Dec 04 Javascript
javascript setTimeout和setInterval计时的区别详解
Jun 21 Javascript
微信jssdk在iframe页面失效问题的解决措施
Mar 03 Javascript
BootStrap中Datetimepicker和uploadify插件应用实例小结
May 26 Javascript
基于JS实现省市联动效果代码分享
Jun 06 Javascript
jQuery选择器_动力节点Java学院整理
Jul 05 jQuery
AngularJS实现tab选项卡的方法详解
Jul 05 Javascript
js 将线性数据转为树形的示例代码
May 28 Javascript
Vue Router 实现动态路由和常见问题及解决方法
Mar 06 Javascript
微信小程序canvas动态时钟
Oct 22 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
雄兵连:第三季确定会出,不过时间未定,鹤熙是第三季的主角!
2020/03/13 国漫
第九节 绑定 [9]
2006/10/09 PHP
PHP $_SERVER详解
2009/01/16 PHP
对squid中refresh_pattern的一些理解和建议
2009/04/17 PHP
php-msf源码详解
2017/12/25 PHP
JS获取scrollHeight问题想到的标准问题
2007/05/27 Javascript
用javascript做拖动布局的思路
2008/05/31 Javascript
jQuery仿Excel表格编辑功能的实现代码
2013/05/01 Javascript
Jquery中的层次选择器与find()的区别示例介绍
2014/02/20 Javascript
jQuery 实现侧边浮动导航菜单效果
2014/12/26 Javascript
bootstrap学习使用(导航条、下拉菜单、轮播、栅格布局等)
2016/12/01 Javascript
iOS + node.js使用Socket.IO框架进行实时通信示例
2017/04/14 Javascript
详解基于Vue+Koa的pm2配置
2017/10/24 Javascript
vue axios 简单封装以及思考
2018/10/09 Javascript
在vue项目中引入vue-beauty操作方法
2019/02/11 Javascript
使用jquery的cookie实现登录页记住用户名和密码的方法
2019/03/13 jQuery
JS图片懒加载技术实现过程解析
2020/07/27 Javascript
vue绑定class的三种方法
2020/12/24 Vue.js
[54:05]DOTA2-DPC中国联赛定级赛 SAG vs iG BO3第一场 1月9日
2021/03/11 DOTA
python实现简单点对点(p2p)聊天
2017/09/13 Python
tensorflow 获取变量&amp;打印权值的实例讲解
2018/06/14 Python
详解python pandas 分组统计的方法
2019/07/30 Python
处理Selenium3+python3定位鼠标悬停才显示的元素
2019/07/31 Python
python3.7实现云之讯、聚合短信平台的短信发送功能
2019/09/26 Python
Python脚本导出为exe程序的方法
2020/03/25 Python
Python-openpyxl表格读取写入的案例详解
2020/11/02 Python
跑步、骑行和铁人三项的高性能眼镜和服装:ROKA
2018/07/06 全球购物
药学专业大学生自荐信
2013/09/28 职场文书
跟单文员的岗位职责
2013/11/14 职场文书
电信营业员自我评价分享
2014/01/17 职场文书
多媒体专业自我鉴定
2014/02/28 职场文书
小学校长汇报材料
2014/08/20 职场文书
高中课前三分钟演讲稿
2014/09/13 职场文书
四风剖析查摆对照检查材料思想汇报
2014/09/24 职场文书
2015年社区妇联工作总结
2015/04/21 职场文书
幼儿园园长安全责任书
2015/05/08 职场文书