一个可以基于Ajax提交的表单验证

原创|其它|编辑:郝浩|2009-04-01 09:24:28.000|阅读 684 次

概述:最近在做一个项目是 Ajax异步提交的,在网上找了许多表单验证的插件发现都是基于按钮的Submit行为的,只好自己写验证了,写完之后又简单改了一下,写成了 JQuery的一个插件,以方便以后使用。现在拿出来给大家分享一下,我是个新手,里面还有很多的不足之处,希望大家帮我指出来,再进行改正。

# 界面/图表报表/文档/IDE等千款热门软控件火热销售中 >>

  本文示例源代码或素材下载

 最近在做一个项目是 Ajax异步提交的,在网上找了许多表单验证的插件发现都是基于按钮的Submit行为的,只好自己写验证了,写完之后又简单改了一下,写成了 JQuery的一个插件,以方便以后使用。现在拿出来给大家分享一下,我是个新手,里面还有很多的不足之处,希望大家帮我指出来,再进行改正。

  这个插件主要是用Jquery写的,结合正则表达式实现验证规则。

  使用方法:

  首先导入Jquery1.3.1.js和validate.js两个脚本文件,后者是我写的验证插件只有3kb大小。

  1.确定你想验证的规则写出相应的正则表达式

  2.给需要验证的文本框加入一个属性“reg”,将你想实现的正则式赋给这个属性。

   再加入一个属性“errormsg”,定义你的错误信息,可以将错误信息显示在后面。

  3.在要验证的文本框后面加一个<span></span>空标签(用于显示错误提示和信息),必须紧跟文本框后, 

  且只能加一个。

  4.给要引发验证的按钮添加一个属性“isSubmit”,给定ture和false两个值,用来决定是否进行异步提交,

  如果要异步提交,就设置成false,默认情况下是true;

 5.如果是异步提交的话,必须给定发送数据的方法,这个方法名必须是btnSendData,并且不用手动调用

  这个方法,插件会自动帮你调用的。

  实现效果:

  当你输入不正确的表达式时,失去焦点后会在文本框的后面显示错误的图标和错误信息,

  输入正确的时候,显示一个正确的图标。

 点击按钮有同样的效果,且阻止你提交数据。

  如图:

一个可以基于Ajax提交的表单验证


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@evget.com

文章转载自:博客园

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP