-
validation插件的选择器扩展: 1、:blank 选择所有值为空的元素,会自动去除半角的空格,全角的空格则不为空 2、:filled 选择所有值不为空的元素 会自动去除半角的空格,全角的空格则不为空 3、:unchecked 选择所有没有被选中的元素查看全部
-
validate()方法配置项之四: 1、showErrors:可以显示总共有多少个未通过验证的元素 如:showErrors:function(errorMap,errorList){ errorMap:元素信息和错误信息的键值对 errorList:元素信息、错误信息、验证方法等信息列表 this.defaultShowErrors();//使用默认的错误提示信息展示方式,需要这个否则错误信息不显示了 } 2、errorPlacement:自定义错误信息放在哪里,配合groups一起使用 3、success:要验证的元素通过验证后的动作 如:success:"right" 或 success:function(label){label.addClass("right")} 效果是给错误信息展示label元素的class属性值追加right值 4、highlight:可以给未通过验证的元素加效果 如:highlight:function(element,errorClass,validClass){ //element:绑定验证的元素 //errorClass:验证错误信息展示label的class属性值 //validClass:验证通过信息展示label的class属性值 } 5、unhighlight:去除未通过验证的元素的效果,一般和highlight同时使用,同上查看全部
-
validate()方法配置项之三: 1、errorClass:指定错误提示的css类名,可以自定义错误提示的样式 2、validClass:指定验证通过的css类名 3、errorElement:使用什么标签标记错误 4、wrapper:使用什么标签把上面的errorElement包起来 5、errorLabelContainer:把错误信息统一放在一个容器里面 6、errorContainer:显示或者隐藏验证信息,可以自动实现有错误信息出现时把容器属性变为显示,无错误时隐藏,自定义错误提示,跟原有错误提示的一块显示 用法如下:查看全部
-
validate()方法配置项之二: 1、onsumbmit:是否在提交时验证,默认值true表示提交时验证 2、onfocusout:是否在获取焦点时验证,默认值true表示提交时验证 3、onkeyup:是否在敲击键盘时验证,默认值true表示提交时验证 4、onclick:是否在鼠标点击时验证,一般用于checkbox或者radio,默认值true表示提交时验证 5、focusInvalid:提交表单后,未通过验证的表单(第一个或提交之前获得焦点的未通过验证的表单)是否会获取焦点 boolean值 6、focusCleanup:当未通过验证的元素获得焦点时,是否移除错误提示,同上查看全部
-
rules中的校验方法都可以定义depends属性,表示当条件满足时返回true,则执行校验方法 针对参数为boolean类型的校验方法: required:{ //只有depends:function(element)返回true,required校验方法才起作用 depends:function(element){ //:filled是Validation自带的选择器,匹配填写内容的元素 return $("#password").is(":filled") } } 针对参数为非boolean类型的校验方法如下: maxlength:{ param:2 //只有depends:function(element)返回true,maxlength校验方法的值才设置为2 depends:function(element){ //:filled是Validation自带的选择器,匹配填写内容的元素 return $("#password").is(":filled") } } } groups的使用如下: groups:{login:"username password confirm-password"} //对一组元素进行验证 errorPlacement:function(error,element){ //对一组元素验证后错误信息显示 error.insertBefore("#info");//将一组元素的错误信息都显示在id="info"的元素上 }查看全部
-
validate()方法配置项之一: 1、submitHandler:通过验证后运行的函数,可以加上表单提交的方法 如:submitHandler:function(form){ //提交表单或者其他的操作都可以 $(form).submit(); } 2、invalidHandler:无效表单提交后运行的函数 如:invalidHandler:function(event,validator){ //event:无效验证触发的事件 //validator:对象 } 也可以写事件来触发invalidHandler的event事件,如: $("#form").on("invalid-form",function(event,validator){ }) 3、ignore:对某些元素不进行验证,值为选择器,默认值为“:hidden”,表示默认不对隐藏的元素校验 4、rules:定义校验规则 5、messages:定义提示信息 6、groups:对一组元素的验证,用一个错误提示,用errorPlacement控制把出错信息放在哪里查看全部
-
Validator对象的静态方法: 1、jQuery.validator.addMethod(name,method[,message]):增加自定义的验证方法 2、jQuery.validator.format(template,argument,argumentN...):格式化字符串,用参数代替模板中的{n} 如:var template=$.validator.format("{0}-{1}-{2}"); template("你","我","他")或template(["你","我","他"])则输出"你-我-他",参数个数不够则会输出{n}来代替 3、jQuery.validator.setDefaults(options):修改插件默认设置 如:$.validator.setDefaults({debug:true});表示给所有的表单都设置 4、jQuery.validator.addClassRules(name,rules):为某些class属性值包含name的元素增加验证规则 如:$.validator.addClassRules({text:{required:true,minlength:5}});表示给class="text"的元素添加验证规则查看全部
-
validate方法返回Validator对象,Validator对象的方法如下: 1、Validator.form():验证表单是否有效,返回true/false; 2、Validator.element(element):验证某个元素是否有效,返回true/false; 如:validator.element("#username") 3、Validator.resetForm():把表单恢复到验证前原来的状态,会清除显示的验证错误信息 4、Validator.showErrors(errors):针对某个元素显示特定的错误信息 如:Validator.showErrors({username:"xxxxxx",passworld:"xxxxx"}),新的错误信息会立即显示 5、Validator.numberOfInvailds():返回无效(即没通过验证的)的元素数量查看全部
-
valid()方法:检查表单或某些元素是否有效,返回值为boolean型, 全部通过检查规则返回true,只要有不通过的检查规则都返回false rules()方法:获取表单元素的校验规则 rules("add",rules):向表单元素增加校验规则,返回增加后的校验规则 如:$("#username").rules("add",{email:true,maxlength:10}); rules("remove",rules):删除表单元素校验规则,返回删除后的校验规则 如:$("#username").rules("remove","email maxlength");查看全部
-
validation插件的基本验证方法之四: 13、number:数字验证,任意整形、非整形、负数、整数皆可 14、digits:整数验证,必须为大于等于0的数字 PS:以上验证方法的值为boolean,true表示进行验证 15、equalTo:与另一个元素值相等验证,值为选择器,表示是和那一个元素的值比较 如:equalTo:"#password",表示用当前元素的值和id="password"元素的值相比较查看全部
-
validation插件的基本验证方法之三: 9、email:Email格式校验 10、url:url格式校验,需要带“http://”或“https://”等前缀 11、date:日期校验,使用的是js的date类型,只要能被Date.parse识别的都是有效的 12、dateISO:ISO日期校验,格式必须为yyyy/MM/dd或yyyy-MM-dd的 PS:以上验证方法的值都是boolean类型,true表示进行验证查看全部
-
validation插件的基本验证方法之二: 长度校验: 3、minlength:最小长度验证 4、maxlength:最大长度验证 5、rangelength:长度范围, 如:rangelength:[minlength,maxlength]可用于代替minlength和maxlength 数值校验 6、min:数值最小值校验 7、max:数值最大值校验 8、range:数值范围校验, range:[min,max]可代替min和max PS:以上验证方法的值都为数字查看全部
-
validation插件的基本验证方法之一: 1、required:必填校验(true表示必填) 2、remote:远程校验,用于通过访问服务器来校验数据的有效性; 如校验用户名是否存在 remote用法: 1、remote使用get请求访问服务器 访问服务器后返回校验结果:正常的时候返回true,检验不通过的时候返回错误提示信息 remote:url 2、remote使用post请求访问服务器 remote:{ url:请求地址 type:请求类型post/get data:{ 需要传递的参数 } }查看全部
-
两个概念: method:验证方法,指的是校验的逻辑 rule:验证规则,指的是元素和验证方法的关联 validate()方法:validation插件的核心方法,定义了基本的校验规则和一些有用的配置项。 如:debug参数设置为true,则表单不会提交,只进行检查,用于调试。查看全部
-
先引用jquery.js文件,后引用jquery.validation.js文件,因为后者依赖前者 label的for属性规定label与哪个表单元素绑定,当用户点击label时与其绑定的表单元素会获取焦点。 ready事件():当DOM(文档对象模型)已经加载,并且页面(包括图像)已经完全呈现时,会触发。 用法如图: rules:定义表单验证的规则 message:用于定义表单验证提示信息 rules和message中使用的都是元素的name属性值,而不是id属性值,rules和message中的验证方法需要一致,这样当某一个验证方法不通过,才能做出对应的提示 比如:rules中使用required:true,则message则使用required:用户名必填,这样当用户名没有填写时则会提示“用户名必填”查看全部
举报
0/150
提交
取消