1. 将校验规则写到JS中–行为与结构分离,通过使用name属性来关联字段和验证规则【推荐】
<script src ="../jquery.validate.messages_cn.js" type="text/javascript"></script>
<!--JQuery默认为英文提示,导入此使其提示为中文-->
<script src="../../scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script src="../../jquery.validate.js" type="text/javascript"></script>
<script src="../../jquery.metadata.js" type="text/javascript"></script>
<!--引入自己使用的JQuery插件-->

JQuery代码:
$("#formId").validate({
rules:{
username:{required:true,minlength:2},
email:{required:true,email:true}
},
messages:{
username:{required:"必须填写",minlength:"最少2个字符"}
<!--可以在此加入提示信息-->
}
})

<form class="cmxform" id="formId" method="post" action="">
<fieldset>
<legend>输入您的名字,邮箱,</legend>
<p>
<label for="cname">Name (必需, 最小两个字母)</label>
<input id="cname" name="username" type="text" >
</p>
<p>
<label for="cemail">E-Mail (必需)</label>
<input id="cemail" type="email" name="email" >
</p>
<p>
<input class="submit" type="submit" value="Submit">
</p>
</fieldset>
</form>

2.将验证信息全部写在class属性中【不推荐】

<input id="username" name="username" size="25" class="{validate: {required: true , minlength:2}}"  value="" />
<input id="email" name="email" size="25" class="{validate:{required: true , email: true}}" value="" />
-------------------------------------------------------
JQuery代码:
$("#formId").validate({meta: "validate"});
//meta string方式

3.将要验证的规则作为元素的属性–将验证信息全部写在class属性中【不推荐】
PS:注意与2的区别
JQuery代码如下:

<script type="text/javascript">
$.validator.setDefaults({
submitHandler: function() {
alert("提交事件!");
form.submit();
}
});
$(document).ready(function(){
$("#formID").validate();
});
</script>

同下~~

$().ready(function() {
$("#formID").validate({
submitHandler:function(form){
alert("提交事件!");
form.submit();
}
});
});

验证信息写入表单里面元素属性:

<input id="cusername" name="username" size="25" class="required" minlength="2" />
<input id="cemail" name="email" size="25" class="required email" />

validation把验证规则都封装在了内部,调用from表单里标出的class和minlength属性,去告诉其自身所在input元素所用的验证规则。


4.通过extends扩展messages

jQuery.extend(jQuery.validator.messages, {
required: "该字段不能为空",
email: "请输入正确格式的电子邮件",
url: "请输入合法的网址",
date: "请输入合法的日期",
dateISO: "请输入合法的日期 (ISO).",
number: "请输入合法的数字",
digits: "只能输入整数",
creditcard: "请输入合法的信用卡号",
notnull:"不能为空"
});

5.另外可以自定义表单验证,比如手机号
​​​自定义表单验证​