jQuery表单验证插件解析(推荐)

一：插件

(1) Validform_v5.3.1_min.js　　Validform_Datatype.js

(2)网址：http://validform.rjboy.cn

　　在这个网站上有demo和插件下载链接。

二：普通验证

（1）Validform_Datatype.js

/*
Validform datatype extension
By sean during December 8, 2012 - February 20, 2013
For more information, please visit http://validform.rjboy.cn
扩展以下类型：
date：匹配日期
zh：匹配中文字符
dword：匹配双字节字符
money：匹配货币类型
ipv4：匹配ipv4地址
ipv6：匹配ipv6地址
num：匹配数值型
qq：匹配qq号码
unequal：当前值不能等于被检测的值，如可以用来检测新密码不能与旧密码一样
notvalued：当前值不能包含指定值，如密码不能包含用户名等的检测
min：多选框最少选择多少项
max：多选框最多不能超过多少项
byterange:判断字符长度，中文算两个字符
numrange：判断数值范围，如小于100大于10之间的数
daterange：判断日期范围
idcard：对身份证号码进行严格验证
*/

（2）Validform v5.3.1　

var tipmsg = {
tit : "提示信息",
w : {
"*" : "不能为空！",
"*6-16" : "请填写6到16位任意字符！",
"n" : "请填写数字！",
"n6-16" : "请填写6到16位数字！",
"s" : "不能输入特殊字符！",
"s6-18" : "请填写6到18位字符！",
"p" : "请填写邮政编码！",
"m" : "请填写手机号码！",
"e" : "邮箱地址格式不对！",
"url" : "请填写网址！",
"w1" : "必须输入字母开头、可带数字、下划线的字符"
},
def : "请填写正确信息！",
undef : "datatype未定义！",
reck : "两次输入的内容不一致！",
r : "通过信息验证！",
c : "正在检测信息…",
s : "请{填写|选择}{0|信息}！",
v : "所填信息没有经过验证，请稍后…",
p : "正在提交数据…"
}

（3）使用

<input name="startTime" class="Wdate" onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" style="width: 150px"
value="" datatype="date" nullmsg="开始时间不能为空" errormsg="日期格式不正确!" >

在input中加入属性datatype。nullmsg是为空时的提示语，errormsg是不满足datatype属性格式时的提示语。

三：特殊验证

（1）特殊验证指js中提供的方法不能满足实际需求时，需要自己写相应的datatype来满足需求。

比如，结束时间不小于开始时间：

$(".registerform").Validform({
datatype:{
"enddate":function(gets,obj,curform,regxp){
/*参数gets是获取到的表单元素值，
obj为当前表单元素，
curform为当前验证的表单，
regxp为内置的一些正则表达式的引用。*/
var reg1=regxp["date"],
startdate=curform.find("[name=startTime]").val(),
enddate=gets;
if(reg1.test(enddate)&&startdate<enddate){return true;}
return false;
}
},
ajaxPost:true
});

以上所述是小编给大家介绍的jQuery表单验证插件解析(推荐)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • jquery表单验证插件（jquery.validate.js）的3种使用方式

    jquery表单验证插件（jquery.validate.js）的3种使用方式

    jquery  验证非常简单,下面总结常用的三种方式: 第一种方式:也是比较标准的方式: 首先引入jquery  插件和 jquery 验证插件: 第一步:引入插件 复制代码 代码如下: <script type="text/javascript" src="js/jquery-1.6.1.min.js"></script> <script type="text/javascript" src="js/jq

  • jValidate 基于jQuery的表单验证插件

    jValidate 基于jQuery的表单验证插件

    网上的各类表单验证插件的验证规则都是写在脚本里的,但我的插件的验证规则却是写在表单元素的属性里的.如下面的例子: 复制代码 代码如下: <input name="name" type="text" id="name" size="30" jvpattern="^.+$" jverrortip="请输入正确的姓名." jvtipid="spt_name" jvme

  • jQuery formValidator表单验证插件开源了 含API帮助、源码、示例

    2008-07-22 14:47 bug描述:ajaxValidator函数在提交后发生错误,停留在本页面后,再次触发校验会让提示内容一直处于onload状态. 这个bug已经修复,请重新下载. 2008/7/17 14:12:00 jQuery formValidator 3.1ver 1.为inputValidator增加empty属性.用于设置控件文本值是否允许两边为空.具体请看demo1里的密码的校验代码. 该属性是个对象,默认值{leftempty:true,rightempty:tr

  • jquery表单验证使用插件formValidator

    jquery表单验证使用插件formValidator

    1.首先在项目中添加必备js与css  2.代码中添加引用(必备引用) 复制代码 代码如下: <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <!--jquery必须库--> <script src="formValidator1/formValidator-4.0.1.min.js" type=&quo

  • jquery插件制作 表单验证实现代码

    先下页面代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>&l

  • Jquery插件easyUi表单验证提交(示例代码)

    复制代码 代码如下: <form id="myForm" method="post">  <table align="center" style="width:400px;height:auto;margin-top: 20px">           <tr>                                           <td align="righ

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

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

    本文实例讲述了JQuery表单验证插件EasyValidator用法.分享给大家供大家参考.具体如下: 本插件的宗旨是:用户无需写一行JS验证代码,只需在要验证的表单中加入相应的验证属性即可,让验证功能易维护,可扩展,更容易上手. DEMO中已经包含了常用的正则表达式,可以直接复用,为了考虑扩展性,所以针对不同用户特殊需求,自行写正则吧. EasyValidator实现的功能: 1.提示功能(在表单或者其他标签中加入tip="想提示的文字") 如: 复制代码 代码如下: <inp

  • JS实现的通用表单验证插件完整实例

    JS实现的通用表单验证插件完整实例

    本文实例讲述了JS实现的通用表单验证插件.分享给大家供大家参考.具体如下: 这里演示一个通用的JS表单验证插件代码.使用方法:第一步:需设定表单项数据类型,第二步:实例表单验证,验证错误提示说明(程序有自带相关错误提示,可自定义每项验证错误提示时文本,只需添加msg). 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-normal-table-check-plug-codes/ 具体代码如下: <!DOCTYPE html PUBLIC &qu

  • jQuery表单验证插件解析(推荐)

    一:插件 (1) Validform_v5.3.1_min.js Validform_Datatype.js (2)网址:http://validform.rjboy.cn 在这个网站上有demo和插件下载链接. 二:普通验证 (1)Validform_Datatype.js /* Validform datatype extension By sean during December 8, 2012 - February 20, 2013 For more information, pleas

  • jQuery 表单验证插件formValidation实现个性化错误提示

    jQuery 表单验证插件formValidation实现个性化错误提示

    其效果图如下:使用说明 需要使用jQuery库文件和formValidation库文件[下载实例代码] http://jquery.com/ 同时需要自定义显示提示错误信息的CSS样式 使用实例 一,包含文件部分 复制代码 代码如下: <script src="jquery.js" type="text/javascript"></script> <script src="jquery.validationEngine.js&

  • 学习使用jQuery表单验证插件和日历插件

    首先学习使用jQuery表单验证插件: 1.Jquery表单验证插件-Validation的学习与使用 (1)Validation的验证有几种规则,一是在class属性中定义验证规则,如class="required",minlength="2".为了实现将验证规则完全编写到class属性中,另外一种是通过引入新的jquery插件-jquery.metadata.js来实现验证规则的定义,此时表单的验证调用的方法改为如下所示的代码: 将$("#form&q

  • Yii框架中jquery表单验证插件用法示例

    Yii框架中jquery表单验证插件用法示例

    本文实例讲述了Yii框架中jquery表单验证插件用法.分享给大家供大家参考,具体如下: 运行效果图如下: 视图层: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtm

  • jQuery表单验证插件formValidator(改进版)

    枚举对象的使用: 复制代码 代码如下: //各种验证方式支持的标签类型 sustainType: function (elem, setting) { var srcTag = elem.tagName; var stype = elem.type; switch (setting.validatetype) { case _validTypeEnum.InitValidator: return true; case _validTypeEnum.InputValidator: if (srcT

  • 实例详解jQuery表单验证插件validate

    validate插件是一个基于jquery的表单验证插件了里面有许多的常用的一些验证方法我们可以直接调用,具体的我们一起来看看. 例子,html代码 <!DOCTYPE html> <html lang="en"> <head> <include file="Common/Header" /> <meta charset="utf-8"> <script src="/jq

  • jquery表单验证插件validation使用方法详解

    jquery表单验证插件validation使用方法详解

    一.如何使用 引入js文件 <script src="jquery.js"></script> <script src="jquery.validate-1.13.1.js"></script> 编写html页面,这里仅以用户名.密码为例 <body> <form id="demoForm"> <fieldset> <legend>用户登录</l

  • Jquery表单验证插件formValidator使用方法

    Jquery表单验证插件formValidator使用方法

    使用步骤: 1.首先在项目中添加必备js与css 2.代码中添加引用(必备引用) <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <!--jquery必须库--> <script src="formValidator1/formValidator-4.0.1.min.js" type="text

随机推荐