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


Posted in Javascript onJuly 21, 2016

一:插件

(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表单验证插件解析(推荐),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript 控制 html元素 显示/隐藏实现代码
Sep 01 Javascript
jquery 读取页面load get post ajax 四种方式代码写法
Apr 02 Javascript
javascript中的作用域和上下文使用简要概述
Dec 05 Javascript
jQuery实现放大镜效果实例代码
Mar 17 Javascript
BootStrap 动态添加验证项和取消验证项的实现方法
Sep 28 Javascript
微信小程序 Tab页切换更新数据
Jan 05 Javascript
angular-ngSanitize模块-$sanitize服务详解
Jun 13 Javascript
jQuery实现的点击显示隐藏下拉菜单功能完整示例
May 17 jQuery
JAVA面试题 static关键字详解
Jul 16 Javascript
Node.js API详解之 querystring用法实例分析
Apr 29 Javascript
javaScript实现一个队列的方法
Jul 14 Javascript
js+h5 canvas实现图片验证码
Oct 11 Javascript
JavaScript 数组- Array的方法总结(推荐)
Jul 21 #Javascript
完美JQuery图片切换效果的简单实现
Jul 21 #Javascript
jQuery的ajax下载blob文件
Jul 21 #Javascript
picLazyLoad 实现图片延时加载(包含背景图片)
Jul 21 #Javascript
浅谈DOCTYPE对$(window).height()取值的影响
Jul 21 #Javascript
jQuery新窗口打开外链接
Jul 21 #Javascript
JS for循环中i++ 和 ++i的区别介绍
Jul 20 #Javascript
You might like
VML绘图板②脚本--VMLgraph.js、XMLtool.js
2006/10/09 PHP
模仿OSO的论坛(五)
2006/10/09 PHP
php7下的filesize函数
2019/09/30 PHP
使用apply方法处理数组的三个技巧[译]
2012/09/20 Javascript
js去字符串前后空格5种实现方法及比较
2013/04/03 Javascript
node.js中的path.extname方法使用说明
2014/12/09 Javascript
Javascript仿新浪游戏频道鼠标悬停显示子菜单效果
2015/08/21 Javascript
jquery实现邮箱自动填充提示功能
2015/11/17 Javascript
全面理解闭包机制
2016/07/11 Javascript
Vue数据驱动模拟实现3
2017/01/11 Javascript
jquery实现左右滑动式轮播图
2017/03/02 Javascript
JS实现自定义状态栏动画文字效果示例
2017/10/12 Javascript
VueJs 搭建Axios接口请求工具
2017/11/20 Javascript
Windows下Node爬虫神器Puppeteer安装记
2019/01/09 Javascript
vue 集成jTopo 处理方法
2019/08/07 Javascript
JavaScript实现简单的计算器
2020/01/16 Javascript
Node登录权限验证token验证实现的方法示例
2020/05/25 Javascript
使用python搭建Django应用程序步骤及版本冲突问题解决
2013/11/19 Python
Python中使用 Selenium 实现网页截图实例
2014/07/18 Python
Python的Django框架中设置日期和字段可选的方法
2015/07/17 Python
python实现超市扫码仪计费
2018/05/30 Python
Python封装原理与实现方法详解
2018/08/28 Python
Python中出现IndentationError:unindent does not match any outer indentation level错误的解决方法
2020/04/18 Python
Python爬虫学习之翻译小程序
2019/07/30 Python
关于PySnooper 永远不要使用print进行调试的问题
2021/03/04 Python
canvas环形倒计时组件的示例代码
2018/06/14 HTML / CSS
保护环境的建议书
2014/03/12 职场文书
警示教育活动总结
2014/05/05 职场文书
法学专业毕业实习自我鉴定2014
2014/09/27 职场文书
2014年数学教师工作总结
2014/12/03 职场文书
打架检讨书范文
2015/01/27 职场文书
医院保洁员岗位职责
2015/02/13 职场文书
中学教师师德师风承诺书
2015/04/28 职场文书
2015年小学二年级班主任工作总结
2015/05/21 职场文书
国家助学金受助感言
2015/08/01 职场文书
什么是Python装饰器?如何定义和使用?
2022/04/11 Python