JAVASCRIPT验证用户指南

1、认证认可框架Javascript验证北京中认网信息技术有限公司修订历史记录日期版本说明作者目录123简介.4JAVASCRIPT验证函数.4自动验证功能.53.13.24使用CLASS.5使用脚本定义验证.6自定义扩展.84.14.2添加新校验.8重写消息提示信息.85附录：支持的验证规则.91简介目前框架提供javascript验证函数。也提供自动验证功能。2Javascript验证函数目前框架提供了3自动验证功能框架使用jQueryValidationPlugin做验证框架，在它基础上做了扩展。在页面上输入以下信息<%taglibprefix="jq"uri=&q

2、uot;/cafJqueryTags"%><jq:validate></jq:validate>第一行引入框架对jquery封装的标签；第二行引入验证脚本文件。页面将自动加载验证脚本，可以支持以下两种形式的验证。3.1使用class可以直接使用class添加验证：<scripttype="text/javascript">$("#bixie").validate();$(document).ready(function();</script><formid="bixie&qu

3、ot;><fieldset><p><labelfor="dianh1">电话：</label><inputid="dianh1"name="dianh1"class="phone"/></p><p><labelfor="dianh2">电话（必填）：</label><inputid="dianh2"name="dianh2"class=&

4、quot;phonerequired"/></p><inputtype="submit"value="submit"/></fieldset></form>通过执行$("#bixie").validate();给form添加了验证其中bixie为form的id。如果想自定义消息，可以按下面的样式写：<p><labelfor="youb">邮编：</label><inputid="youb"n

5、ame="youb"class="validate:required:true,zip:true,messages:required:'请输入！',zip:'我要的是邮编!'"/></p>class="validate:required:true,zip:true,messages:required:'请输入！',zip:'我要的是邮编!'"这里的意思是：添加两个校验，一个是必填，一个是必须是邮政编码，如果没有填写，则弹出错误消息“请输入”，如果输入的信

6、息不是邮编则弹出“我要的是邮编”注：在class定义后可继续添加别的对input定义的class名字，改变input样式，这样做对其校验功能没有影响。3.2使用脚本定义验证可通过脚本设置表单验证的规则和出错信息。推荐使用这种方法，因为其明确，可读性强，不影响form表单的格式，不占用class属性。示例如下：<script>$().ready(function()$("#signupForm").validate(rules:firstname:"required",lastname:"required",username

7、:required:true,minlength:2,password:required:true,minlength:5,confirm_password:required:true,minlength:5,equalTo:"#password"email:required:true,email:true,topic:required:"#newsletter:checked",minlength:2,agree:"required"messages:emailCode:"请正经填写一下。",firstname:

8、"Pleaseenteryourfirstname",lastname:"Pleaseenteryourlastname",username:required:"Pleaseenterausername",characters"minlength:"Yourusernamemustconsistofatleast2,password:required:"Pleaseprovideapassword",minlength:"Yourpasswordmustbeatleast5charac

9、terslong",confirm_password:required:"Pleaseprovideapassword",minlength:"Yourpasswordmustbeatleast5characterslong",equalTo:"Pleaseenterthesamepasswordasabove"email:"Pleaseenteravalidemailaddress",agree:"Pleaseacceptourpolicy"););效果参考http:/jquery.

10、bassistance.de/validate/demo/44.1自定义扩展添加新校验JqueryValidate支持扩展新的校验方法，示例如下：/邮政编码验证/六个0-9间的数字$.validator.addMethod("zip",function(value,element)vartel=/0-96$/;returnthis.optional(element)|(tel.test(value);,"请正确填写您的邮政编码");addMethod：填写新的校验方法第一个参数是校验的名称；第二个参数是校验方法，校验方法的第一个参数是需要校验的值，第二个参数是需要校验的对象；第三个参数是校验出错时默认的提示信息。4.2重写消息提示信息可以重写消息提示的方法，具体方法如下：showErrors是jqueryValidate处理错误信息的方法，它能得到一个参数errorList,errorList是一个数组，每一个元素是一个错误对象，包含两个属性，message，错误消息；element，出错的组件。5附录：支持的验证规则所支持的验证包括：Jqueryvalidationplugin提供了以下校验功能：required必填remoteminlength字符个数不少于maxlength字符个数不多于rangelength字符个数在两个数之间m