jQuery.Validate在Web中应用.docVIP

jQuery.Validate在Web中应用 　　摘要：该文对表单验证插件jQuery.Validate做了简单的介绍对其使用方法、验证方式、以及错误提示信息的修改做了简单的介绍，并对其优点做了简要的分析。 　　关键词：Validate；验证；控件；Class；jQuery JavaScript 　　中图分类号：TP311文献标识码：A文章编号：1009-3044(2012)26-6267-02 　　JQuery.Validate Application in Web 　　WANG Na, ZHU Xiu-qun, MA Qiang 　　(Xinjiang Wind Energy Institute, Urumqi 830000,China) 　　Abstract: The form validation jQuery.Validate made a brief introduction to the use of methods, validation, and error informa? tion changes were briefly introduced, and the advantages to do brief analysis. 　　Key words: validate；verification；controls；class；jQuery；JavaScript 　　jQuery.Validate插件是历史最悠久的jQuery插件之一，经过了全球众多项目的验证；它有很多的优点，比如：内置大量的验证规则、支持自定义验证规则、支持自定义验证信息提示等；而且它在实时验证方面的表现也很突出，更能实现无刷新实时验证的效果，这与传统的控件验证及后台验证相比，更加人性化了。 　　 1 jQuery.Validate的使用方法 　　首先，将校验库引入到页面中，如下： 　　 　　 　　其次，为form进行验证注册 　　jQuery(document).ready(function(){ 　　$(#form).validate(); 　　}); 　　最后，编写具体的验证代码 　　额定功率： 　　不需要拖控件、指定验证控件等啰嗦的代码，仅仅一个样式名就能实现验证，书写简单、易于操作，还可以根据需求自由的组合验证规则。 　　 2 jQuery.Validate指定验证规则的验证方式 　　2.1书写class样式指定验证规则或属性验证规则 　　在控件中书写class的方式，这种验证方式书写非常的方便，只用几个属性就能轻松搞定多种验证，且可以根据需求自由的组合验证规则，比起.Net传统的验证方式更简单快捷，但这种方式许多高级验证都无法使用，且只能使用内置的消息，不能满足个性化需求。 　　举例如下： 　　年龄： 　　2.2以JSON格式书写class样式 　　同样是在控件中书写class的验证方式，但是书写方式是JSON格式，此方式支持自定义验证消息，增强了界面的友好性，并可以使用高级验证规则。 　　举例如下?? 　　风机型号： 　　2.3调用validate()方法时传递字段的验证规则 　　采用纯JS的方式，很好的解决了HTML和验证规则的分离，将每个页面的验证规则都写在头部的脚本中，方便日后维护，但对于较多控件的页面书写较为麻烦； 　　举例如下： 　　$(#form).validate({ 　　rules: { latanlong: {required: true, maxlengh: 20} 　　}) 　　自定义验证规则只需定义相应的正则表达式即可实现相应的验证，实现非常方便；自定义验证是通过addMethod()方法实现的，语法如下： 　　jQuery.validator.addMethod( name, method, [message] ) 　　参数name要添加的方法名，用于标识和引用，必须是一个有效的javascript标识符。 　　参数method方法的实现部分，返回true如果表单元素通过验证。 　　参数message(Optional)该方法的默认验证消息。 　　实例如下： 　　//字母下划线验证 　　jQuery.validator.addMethod(ischrline, function (value, element) { 　　return this.optional(element) || (/^((?!_)[a-zA-Z_]+)$/.test(value)); 　　}, 只能由字母和下划线组成，且只能以字母开头); 　　 4错误提示信息 　　4.1更改错误信息显示的位置 　　默认情况下，错误消息是放在验证元