深入学习jQuery Validate表单验证(二)
本文实例介绍了jQueryValidate表单验证,分享给大家供大家参考,具体内容如下
一、添加一个另外一个插件jquery.validate.messages_cn.js。
改变默认提示方式。
/* *TranslateddefaultmessagesforthejQueryvalidationplugin. *Language:CN *Author:FaylandLam<faylandatgmaildotcom> */ jQuery.extend(jQuery.validator.messages,{ required:"必选字段", remote:"请修正该字段", email:"请输入正确格式的电子邮件", url:"请输入合法的网址", date:"请输入合法的日期", dateISO:"请输入合法的日期(ISO).", number:"请输入合法的数字", digits:"只能输入整数", creditcard:"请输入合法的信用卡号", equalTo:"请再次输入相同的值", accept:"请输入拥有合法后缀名的字符串", maxlength:jQuery.format("请输入一个长度最多是{0}的字符串"), minlength:jQuery.format("请输入一个长度最少是{0}的字符串"), rangelength:jQuery.format("请输入一个长度介于{0}和{1}之间的字符串"), range:jQuery.format("请输入一个介于{0}和{1}之间的值"), max:jQuery.format("请输入一个最大为{0}的值"), min:jQuery.format("请输入一个最小为{0}的值") });
二、jQuery表单验证插件----通过name属性来关联字段来验证,将校验规则写到js代码中。
<html> <head> <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <title>jQuery表单验证插件----通过name属性来关联字段来验证</title> <scriptsrc="../../scripts/jquery-1.3.1.js"type="text/javascript"></script> <scriptsrc="lib/jquery.validate.js"type="text/javascript"></script> <scriptsrc="lib/jquery.validate.messages_cn.js"type="text/javascript"></script> <styletype="text/css"> *{font-family:Verdana;font-size:96%;} label{width:10em;float:left;} label.error{float:none;color:red;padding-left:.5em;vertical-align:top;} p{clear:both;} .submit{margin-left:12em;} em{font-weight:bold;padding-right:1em;vertical-align:top;} </style> <scripttype="text/javascript"> $(document).ready(function(){ $("#commentForm").validate({ rules:{ username:{ required:true, minlength:2 }, email:{ required:true, email:true }, url:"url", comment:"required" } }); }); </script> </head> <body> <formclass="cmxform"id="commentForm"method="get"action=""> <fieldset> <legend>jQuery表单验证插件----通过name属性来关联字段来验证</legend> <p> <labelfor="cusername">姓名</label> <em>*</em><inputid="cusername"name="username"size="25"/> </p> <p> <labelfor="cemail">电子邮件</label> <em>*</em><inputid="cemail"name="email"size="25"/> </p> <p> <labelfor="curl">网址</label> <em></em><inputid="curl"name="url"size="25"value=""/> </p> <p> <labelfor="ccomment">你的评论</label> <em>*</em><textareaid="ccomment"name="comment"cols="22"></textarea> </p> <p> <inputclass="submit"type="submit"value="提交"/> </p> </fieldset> </form> </body> </html>
以上就是本文的全部内容,希望对大家学习jQueryValidate表单验证有所帮助。