jQuery表单验证插件——validation
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<title></title>
<style type="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>
</head>
<body>
<form method="get" action="#" id="commentForm" class="cmxForm">
<fieldset>
<legend>一个简单的验证带有验证信息评论例子</legend>
<p>
<label for="cusername">姓名</label><em>*</em>
<input type="text" name="username" size="25" id="cusername" minlength="2" class="required">
</p>
<p>
<label for="cemail">电子邮箱</label><em>*</em>
<input type="text" name="email" size="25" id="cemail" class="required email">
</p>
<p>
<label for="curl">网址</label><em>*</em>
<input type="text" name="url" size="25" id="curl" class="required url">
</p>
<p>
<label for="ccomment">评论</label><em>*</em>
<textarea name="comment" cols="22" id="ccomment" class="required"></textarea>
</p>
<p><input type="submit" name="" value="提交" class="submit"></p>
</fieldset>
</form>
<script type="text/javascript" src="../scripts/jquery-1.3.1.js"></script>
<script type="text/javascript" src="../scripts/lib/jquery.validate.js"></script>//1.引入jquery库和Validation插件
<script type="text/javascript">
$(function(){
//2.确定哪个表单需要验证
$("#commentForm").validate();
})
</script>
</body>
</html>
注意：针对不同的字段，进行验证规则编码，设置字段相应的属性。
（1）class="required"为必要填，minlength="2"为最小长度为2；
（2）class="required email"为必须填写和内容要符合E-mail格式；
（3）class="url"为url格式；
