jQuery Validate验证框架详解.doc

jQuery Validate验证框架详解(此处标题超链接) 链接地址：/linjiqin/p/3431835.html 一、导入js库 注：%=request.getContextPath() %返回web项目的根路径。 二、默认校验规则三、默认的提示 如需要修改，可在js代码中加入： 推荐做法，将此文件放入messages_cn.js中，在页面中引入 四、使用方式1、metadata用法，将校验规则写到控件中 使用class={}的方式，必须引入包：jquery.metadata.js；可以使用如下的方法，修改提示内容：class={required:true,minlength:5,messages:{required:请输入内容}}；在使用equalTo关键字时，后面的内容必须加上引号，如下代码：class={required:true,minlength:5,equalTo:#password}。 2、将校验规则写到js代码中 五、常用方法及注意问题1、用其他方式替代默认的submit 可以设置validate的默认值，写法如下：$.validator.setDefaults({submitHandler: function(form) { alert(submit!); form.submit(); }}); 如果想提交表单，需要使用form.submit()，而不要使用$(form).submit() 2、debug，只验证不提交表单如果这个参数为true，那么表单不会提交，只进行检查，调试时十分方便 如果一个页面中有多个表单都想设置成为debug，用$.validator.setDefaults({debug: true}) 3、ignore：忽略某些元素不验证ignore: .ignore 4、更改错误信息显示的位置errorPlacement：Callback Default: 把错误信息放在验证的元素后面?指明错误放置的位置，默认情况是：error.appendTo(element.parent());即把错误信息放在验证的元素后面?errorPlacement: function(error, element) {?? ? ?error.appendTo(element.parent());?} //示例 代码的作用是：一般情况下把错误信息显示在td class=status/td中，如果是radio显示在td/td中，如果是checkbox显示在内容的后面 errorClass：String Default: error?指定错误提示的css类名，可以自定义错误提示的样式 errorElement：String Default: label?用什么标签标记错误，默认的是label你可以改成em errorContainer：Selector?显示或者隐藏验证信息，可以自动实现有错误信息出现时把容器属性变为显示，无错误时隐藏，用处不大errorContainer: #messageBox1, #messageBox2 errorLabelContainer：Selector把错误信息统一放在一个容器里面。 wrapper：String用什么标签再把上边的errorELement包起来 一般这三个属性同时使用，实现在一个容器内显示所有错误提示的功能，并且没有信息时自动隐藏errorContainer: div.error,errorLabelContainer: $(#signupForm div.error),wrapper: li 5、更改错误信息显示的样式设置错误提示的样式，可以增加图标显示，在该系统中已经建立了一个validation.css专门用于维护校验文件的样式 6、每个字段验证通过执行函数success：String,Callback 要验证的元素通过验证后的动作，如果跟一个字符串，会当做一个css类，也可跟一个函数 添加valid到验证元素, 在CSS中定义的样式stylelabel.valid {}/stylesuccess: valid 7、验证的触发方式修改下面的虽然是boolean型的，但建议除非要改为false,否则别乱添加。a.onsubmit：Boolean Default: true?提交时验证. 设置唯false就用其他方法去验证b.onfocusout：Boolean Default: true?失去焦点是验证(不包括checkboxes/radio buttons)c.onkeyup：Boolean Default: true?在keyup时验证.d.onclick：Boolean Defau