标签：
jquery插件
jquery插件项目托管于gitHub，项目地址https://github.com/jquery/plugins.jquery.com
现在网页的表单如果没有验证功能，在用户咬牙切齿填写完那一望无际的表单按下提交按钮的一刹那，作为一名伟大的前端开发人员，内心会受到谴责的。当然，表单验证的方式有很多，但是validation作为最优秀的插件之一，必须得用起来，不然，你好意思吹牛*吗？不对，应该说你好意思吗？还不能吹牛*！
jquery Validation插件地址jquery validation插件下载
鉴于令人发指的下载速度，也可以转到jquery validation插件下载
绝对要相信一句话，实践是检验真理的唯一标准。所以走着！
<script src="../jquery-1.12.0.min.js"></script>
// 引入jquery,千万不要问我为什么
<script src="jquery.validate.min.js"></script>
//引入validate插件，在下载文件的dist文件夹下就能看到；
<script>
$(function () {
$("#commentForm").validate();
//在表单对象下调用validate方法；
})
</script>
<div class="code"> <form class="cmxform" id="commentForm" method="get" action="#"> <fieldset> <legend>表单</legend> <p> <label for="cusername">姓名：</label> <input id="cusername" name="username" size="25" class="required" minlength="2"/>//注意class和minlength，这两个属性的值required和2为validate方法准备的，意思是必填字段，长度大于2
</p> <p> <label for="cemail">电子邮件</label> <input id="cemail" name="email" size="25" class="required email">//同样注意class属性，required同上，email当然就是确定这是一个邮箱啦； </p> <p> <label for="curl">网址</label> <input id="curl" name="url" size="25" class="url" value=""> //同上 </p> <p> <label for="ccomment">我的评论：</label> <textarea id="ccomment" name="comment" cols="20" class="required"></textarea> //同上 </p> <p> <input class="submit" type="submit" value="提交"> </p> </fieldset> </form> </div>
多么的言简意赅，几个属性就给表单验证了，这么偷懒真的好吗，不写正则真的符合作为一名前端开发攻城狮的身份嘛！其实我想说是真的好，整个世界都清新脱俗了；（但是如果能给正则写的飞起的，请留下你的联系方式，我们做朋友好吗！）
表单验证结果，然并卵，这是我想要的嘛，作为一名中华家人民，你确定后面那一坨有用嘛；相信我，人与人之间还是可以信任的；我们的大师们不会忘了拥有十四亿国民的中华家所用的语言
只要在
<script src="jquery.validate.min.js"></script>
后再引入
<script src="messages_zh.min.js"></script>
你就会发现突然又变得无比自信
哇咔咔，这是什么，这就是我们人见人爱的中文，可以自信的对老板说，表单验证just so so啦；
现在的我们已经可以粗略的做出一个具有一定功能的验证表单了，可是作为一名傲娇的前端攻城狮，目标是星辰大海的我们会就这么满足了嘛！
$("#signupForm").validate({
rules: {
},
messages: {
}
});
表单验证我们需要什么，请大声的说出来（规则和提示，吼吼）！于是在validate内就有了rules和messages！有不明白这两个单词的意思的嘛，请自行百度！
（嘿嘿，打广告百度会给我钱嘛！
百度：你确定有人看！好意思嘛
...
）
$("#signupForm").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
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: {
firstname: "请输入您的名字",
lastname: "请输入您的姓氏",
username: {
required: "请输入用户名",
minlength: "用户名必需由两个字母组成"
},
password: {
required: "请输入密码",
minlength: "密码长度不能小于 5 个字母"
},
confirm_password: {
required: "请输入密码",
minlength: "密码长度不能小于 5 个字母",
equalTo: "两次密码输入不一致"
},
email: "请输入一个正确的邮箱",
agree: "请接受我们的声明",
topic: "请选择两个主题"
}
});
rules是对象1，key/value分别是ID/对象2！value也是一个对象嗷；那这个对象2内的key/value值又是什么意思呢！请看前文！
messages也是一个对象1，key/value分别是id/对象2，对象2内则分别value值则为提示消息，与rules对象2的规则一一对应。
是不是非常清楚呢，是不是感觉整个世界都清晰了呢。
其实我想说的是，下班了，走起！
标签：
原文地址：http://www.cnblogs.com/luohe/p/5685289.html
