JQuery扩展插件Validate 1 基本使用方法并打包下载


Posted in Javascript onSeptember 05, 2011

分别是:
<script src="../Contents/JS/jquery-1.5.js" type="text/javascript"></script>
<script src="../Contents/JS/jquery.validate.min.js" type="text/javascript"></script>

1、基本使用方法,通过样式设置验证规则

<script type="text/javascript"> 
$(function() { $("#signupForm").validate(); }); //验证所选择的表单 
</script> <p> 
<label for="email">Email</label> 
<input id="email" name="email" class="required email" /> 
<!--该项表示电子邮箱是必填的,且是正确的email--> 
</p> 
<p> 
<label for="txtAge">年龄</label> 
<input id="txtAge" name="txtAge" min="18" max="45" /> 
<!--年龄只能在18-45之间--> 
</p>

当表单提交时,如果没有填写email或者是错误的email将发生错误,如下所示:
JQuery扩展插件Validate 1 基本使用方法并打包下载

文本框后面的默认提示可以修改jquery.validate.min.js,将英文查找并替换成中文,样式可以通过css的类样式改变如.required,.email等, 当然这里的class可以一项或多项中间用空格分隔,语法格式与css一样,可选择的项还有:

(1)required:true 必输字段
(2)remote:"check.php" 使用ajax方法调用check.php验证输入值
(3)email:true 必须输入正确格式的电子邮件
(4)url:true 必须输入正确格式的网址
(5)date:true 必须输入正确格式的日期
(6)dateISO:true 必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22 只验证格式,不验证有效性
(7)number:true 必须输入合法的数字(负数,小数)
(8)digits:true 必须输入整数
(9)creditcard: 必须输入合法的信用卡号
(10)equalTo:"#field" 输入值必须和#field相同
(11)accept: 输入拥有合法后缀名的字符串(上传文件的后缀)
(12)maxlength:5 输入长度最多是5的字符串(汉字算一个字符)
(13)minlength:10 输入长度最小是10的字符串(汉字算一个字符)
(14)rangelength:[5,10] 输入长度必须介于 5 和 10 之间的字符串")(汉字算一个字符)
(15)range:[5,10] 输入值必须介于 5 和 10 之间
(16)max:5 输入值不能大于5
(17)min:10 输入值不能小于10

源码下载

Javascript 相关文章推荐
使用jquery动态加载js文件的方法
Dec 24 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
Oct 14 Javascript
基于javascript实现全屏漂浮广告
Mar 31 Javascript
浅析jQuery 3.0中的Data
Jun 14 Javascript
jquery对象和DOM对象的相互转换详解
Oct 18 Javascript
JavaScript常见的五种数组去重的方式
Dec 15 Javascript
react-native DatePicker日期选择组件的实现代码
Sep 12 Javascript
在 Angular中 使用 Lodash 的方法
Feb 11 Javascript
微信小程序实现商品属性联动选择
Feb 15 Javascript
Element图表初始大小及窗口自适应实现
Jul 10 Javascript
详解如何在Javascript中使用Object.freeze()
Oct 18 Javascript
vue项目如何打包之项目打包优化(让打包的js文件变小)
Apr 30 Vue.js
JQuery扩展插件Validate 5添加自定义验证方法
Sep 05 #Javascript
分享20多个很棒的jQuery 文件上传插件或教程
Sep 04 #Javascript
jQuery验证Checkbox是否选中的代码 推荐
Sep 04 #Javascript
Jquery 一次处理多个ajax请求的代码
Sep 02 #Javascript
Javascript变量函数浅析
Sep 02 #Javascript
简短几句jquery代码的实现一个图片向上滚动切换
Sep 02 #Javascript
25个非常棒的jQuery滑块插件和教程小结
Sep 02 #Javascript
You might like
日本收入最高的漫画家:海贼王作者版税年收入高达8.45亿元
2020/03/04 日漫
PHP面向对象编程快速入门
2006/12/14 PHP
PHP实现通过中文字符比率来判断垃圾评论的方法
2014/10/20 PHP
php文档工具PHP Documentor安装与使用方法
2016/01/25 PHP
javaScript 删除字符串空格多种方法小结
2012/10/24 Javascript
简单实例处理url特殊符号&amp;处理(2种方法)
2013/04/02 Javascript
jQuery实现可拖动的浮动层完整代码
2013/05/27 Javascript
JS实现往下不断流动网页背景的方法
2015/02/27 Javascript
JavaScript控制table某列不显示的方法
2015/03/16 Javascript
javascript实现获取服务器时间
2015/05/19 Javascript
详解JavaScript编程中正则表达式的使用
2015/10/25 Javascript
Javascript json object 与string 相互转换的简单实现
2016/09/27 Javascript
JavaScript实现图片本地预览功能【不用上传至服务器】
2017/09/20 Javascript
vue组件的写法汇总
2018/04/12 Javascript
vue 2.1.3 实时显示当前时间,每秒更新的方法
2018/09/16 Javascript
cdn模式下vue的基本用法详解
2018/10/07 Javascript
vue实现微信分享功能
2018/11/28 Javascript
Javascript通过控制类名更改样式
2019/05/24 Javascript
纯异步nodejs文件夹(目录)复制功能
2019/09/03 NodeJs
微信小程序开发之获取用户手机号码(php接口解密)
2020/05/17 Javascript
[01:03:54]Liquid vs IG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
Python PyQt4实现QQ抽屉效果
2018/04/20 Python
python3编写ThinkPHP命令执行Getshell的方法
2019/02/26 Python
python定时任务 sched模块用法实例
2019/11/04 Python
Python PyQt5模块实现窗口GUI界面代码实例
2020/05/12 Python
几款主流好用的富文本编辑器(所见即所得常用编辑器)介绍
2021/03/17 Javascript
amazeui页面分析之登录页面的示例代码
2020/08/25 HTML / CSS
美国诺德斯特龙百货官网:Nordstrom
2016/08/23 全球购物
销售区域经理岗位职责
2015/04/10 职场文书
2015年计生工作总结范文
2015/04/24 职场文书
学校社团活动总结
2015/05/07 职场文书
导游词之台湾阿里山
2019/10/23 职场文书
z-index不起作用
2021/03/31 HTML / CSS
带你彻底理解JavaScript中的原型对象
2021/04/14 Javascript
详解python字符串驻留技术
2021/05/21 Python
Spring boot应用启动后首次访问很慢的解决方案
2021/06/23 Java/Android