欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2022-04-09 08:59:43
本文实例讲述了jquery表单验证插件easyvalidator用法。分享给大家供大家参考。具体如下: 本插件的宗旨是:用户无需写一行js验证代码,只需在要验证的表单中加入相应的...

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

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

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

easyvalidator实现的功能:

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

如:

代码如下:

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

 

或者

代码如下:

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

 

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

代码如下:

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


普通表单验证demo:https://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:https://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。

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

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

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