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

 更新时间:2014年11月15日 14:37:07   投稿:shichen2014  
这篇文章主要介绍了JQuery表单验证插件EasyValidator用法,以实例形式系统分析了EasyValidator的功能特性及具体用法,是非常实用的jQuery插件,需要的朋友可以参考下

本文实例讲述了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

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://www.jb51.net/jiaoben/32303.html

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

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

相关文章

  • jQuery 淡入/淡出效果函数用法分析

    jQuery 淡入/淡出效果函数用法分析

    这篇文章主要介绍了jQuery 淡入/淡出效果函数用法,结合实例形式分析了jQuery 淡入/淡出功能fadeIn()、fadeOut()、fadeToggle()及fadeTo()函数基本功能、使用方法与操作注意事项,需要的朋友可以参考下
    2020-05-05
  • 分享一些常用的jQuery动画事件和动画函数

    分享一些常用的jQuery动画事件和动画函数

    在jquery中,jquery动画事件和动画函数经常用的到,今天小编抽时间给大家整理了些关于常用的jquery动画事件和动画函数,对jquery动画函数和动画事件相关知识感兴趣的朋友一起学习吧
    2015-11-11
  • JQuery each()函数如何优化循环DOM结构的性能

    JQuery each()函数如何优化循环DOM结构的性能

    each()方法能使DOM循环结构简洁,不容易出错。each()函数封装了十分强大的遍历功能,使用也很方便,它可以遍历一维数组、多维数组、DOM, JSON 等等在javaScript开发过程中使用$each可以大大的减轻我们的工作量
    2012-12-12
  • jquery表格datatables实例解析 直接加载和延迟加载

    jquery表格datatables实例解析 直接加载和延迟加载

    这篇文章主要针对jquery表格datatables实例进行解析,可以直接加载和延迟加载,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • JavaScript与JQUERY获取元素的宽、高和位置

    JavaScript与JQUERY获取元素的宽、高和位置

    文章给大家汇总整理了JavaScript以及jQuery获取元素高宽和位置等信息的方法,非常的全面,小伙伴们可以记录下以便查看
    2017-02-02
  • jQuery学习笔记之jQuery的DOM操作

    jQuery学习笔记之jQuery的DOM操作

    jQuery学习笔记之jQuery的DOM操作实现方法, 学习jquery与dom操作的朋友可以参考下。
    2010-12-12
  • jquery ztree异步搜索(搜叶子)实践

    jquery ztree异步搜索(搜叶子)实践

    这篇文章主要介绍了jquery ztree异步搜索,即搜叶子实践,使用jquery ztree开发的树控件经常需要进行一些异步查找叶子节点的操作,感兴趣的小伙伴们可以参考一下
    2016-02-02
  • 详解使用jQuery.i18n.properties实现js国际化

    详解使用jQuery.i18n.properties实现js国际化

    这篇文章主要介绍了使用jQuery.i18n.properties实现js国际化,具有一定的参考价值,感兴趣的可以随小编看一看
    2018-05-05
  • jquery实现多行文字图片滚动效果示例代码

    jquery实现多行文字图片滚动效果示例代码

    多行文字图片滚动效果的实现方法有很多,本例与大家分享的是jquery实现的具体步骤,很实用的
    2014-10-10
  • jQuery中的编程范式详解

    jQuery中的编程范式详解

    这篇文章主要介绍了jQuery中的编程范式,以实例形式详解分析了jQuery中的编程范式,并对比分析了与Prototype的异同及对应用法,非常具有实用价值,需要的朋友可以参考下
    2014-12-12

最新评论