$(document).ready(function(){
$("#demoForm").validate({
rules:{
username:{ //name 指的是name值不是ID
required:true,
minlength:2,
maxlength:10,
rangelength:[2,10] //长度范围,这样就不用最大、最小了
},
password:{
required:true
}
},
message:{
username:{
required:"必填项",
rangelength:"用户名在2-10之内"
},
password:{
required:"必填项"
}
}
});
});
基本API:
method:校验的方法
rule : 规则
在validate 方法中 加上 debug:true //在校验成功后,是不会进行提交操作的
基本的验证方法:
remote :远程校验
在rule规则中使用
min :表示的值 (最小数、最大数、数字范围) minlength :长度
email:邮箱格式 URL :URL格式
$("#demoFrom").validate({
rules:{
username:{
remote:{
url:"",
method:"POST",
date:{
loginTime:function(){
return +new date(); //另外多加一个参数
}
}
}
}
},
message:{
username:{
remote:"用户名错误" //remote 信息提示
}
}
});
[b]
validate : 进阶功能
[/b]
valid()
检查表单是否正确 $("#demoFrom").valid()
rule() 方法, 获取的是节点的规则
[b]
validate 静态方法
[/b]
validate配置项
submitHandler:function(form){ //通过验证后运行的
},
invalidHandler:function(event,validator){ //验证不通过后触发的方法,无效表单提交后运行的函数
}[b][/b]
//追加错误信息的位置
$("#demoFrom").validate({
groups:{
login:"username password";
},
errorPlacement:function(error,element){
error.insertBefore("#info"); //info 要追加的位置的节点
}
});
配置项 : onsubmit :是否在提交时进行验证,默认是true
onfocusout:是否在获取焦点的时候进行验证
onkeyup : 是否在敲击键盘的时候进行验证
onclick : 是否在鼠标点击的时候进行验证 一般用于checkbox或者radio
errorClass : 错误提示的css样式,可以自定义
validClass: 指定验证通过的css样式
errorElement 使用什么标签标记错误
wrapper :使用什么标签把上面的标签包装起来
errorLabelContainer:把错误信息统一放在一个容器里面
errorContainer:显示或者隐藏验证信息可以自动实现有错误时,出现把容器标记为显示,没错误时标记为隐藏
validate 自带的选择器
:blank 选择值为空 的元素 即取消空格后的值的长度是否等于零
:filled 选择所有值不为空的元素 与上面正好相反
:unchecked 所有的没有被选中的元素
validate自定义的验证方法
jQuery.validator.addMethod(name,method,[,message])
name: 方法名
method 方法体 function(value, element,params){}
message :提示信息 可选
分享到:
相关推荐
jQuery表单校验插件validate实例代码集 有多个表同的表单,来共同展现表单验证插件的各种用法,包括判断字符、输入为空、类型判断、适时Ajax方式提示等,通过这些实例可快速掌握验证的方法和要点,此前,源码爱好者...
**jQuery FormValidator 4.0.1:打造高效且实用的表单验证** 在Web开发中,表单验证是不可或缺的一环,它确保用户输入的数据符合预期格式,从而避免无效数据提交,提升用户体验。jQuery FormValidator是一款强大的...
以下是对jQuery表单校验插件Validator的详细说明: **1. 引入所需文件** 在使用Validator之前,需要引入jQuery库以及Validator插件的JavaScript文件。通常,jQuery库可以从CDN获取,而Validator插件可以在其官网...
**jQuery表单验证插件详解** 在Web开发中,表单验证是不可或缺的一部分,它确保用户输入的数据符合预设的规则,从而提高用户体验并减少服务器端的负担。jQuery,一个轻量级、高性能的JavaScript库,提供了丰富的API...
在Web开发中,表单是收集用户数据的重要途径,而表单校验则是确保这些数据质量和安全的关键步骤。本文将详细介绍一种通用的JavaScript(JS)表单校验方法,通过导入特定的JS文件,可以轻松实现对用户输入的验证。 ...
在Web开发中,表单验证是必不可少的部分,而jQuery的validate插件就是专门用于表单验证的一个插件,它提供了丰富的选项和方法,使得开发者能够方便地实现自定义的表单验证规则。 validate插件的安装通常是通过引入...
《jQuery的validate表单校验插件深度解析》 在前端开发中,表单校验是必不可少的一个环节,它能够确保用户输入的数据符合预设的规范,提高用户体验并减轻服务器端的压力。jQuery的validate插件作为一款强大的表单...
jQuery的表单校验插件`validate`是前端开发中常用的一个工具,它极大地简化了对HTML表单数据的验证过程。这个插件基于流行的JavaScript库jQuery构建,为开发者提供了丰富的选项和方法来定制表单验证规则,确保用户...
jQuery Validate 插件依赖 jQuery 库,使用前需要先导入 jQuery的 js 文件,再导入 jquery.validate.js 插件,可以再导入中文提示信息文件 messages_zh.js
《jQuery-validate:轻松掌握表单验证的神器》 在网页开发中,表单验证是必不可少的一环,它能确保用户输入的数据符合预期,提高用户体验,防止无效数据提交到服务器。jQuery-validate是一个强大的JavaScript库,专...
jquery的基础使用和表单校验插件的使用。
在"jquery表单验证实例,对数字,字数,必填项等校验"这个项目中,我们关注的核心知识点包括: 1. **jQuery Validate插件安装与引入**:首先,你需要在HTML文件中引入`jQuery`库和`jQuery Validate`插件的JS文件。...
根据提供的文件信息,下面我将详细介绍关于jQuery表单验证中输入文本内容范围验证的相关知识点。 首先,我们需要了解什么是jQuery表单验证。jQuery表单验证是指使用jQuery这个流行的JavaScript库来增强HTML表单的...
"jQuery校验大全实例"是针对使用jQuery进行表单验证的一个综合资源,非常适合开发者学习和应用。这个压缩包可能包含了各种jQuery验证插件、代码示例以及详细的教程,旨在帮助开发者实现高效且用户友好的表单验证。 ...
首先,jQuery的校验控件通常指的是`jQuery Validation Plugin`,这是一个非常流行的开源插件,它提供了一套完整的表单验证解决方案。通过这个插件,开发者可以轻松添加各种验证规则,如非空、邮箱格式、手机号码格式...
对中文、英文、数字、整数、实数、Email地址格式、基于HTTP协议的网址格式、电话号码格式、手机号码格式、货币格式、邮政编码、身份证号码、QQ号码、日期等等这些控制,别的表单校验控件是代码里写死的,而...