引入jquery.validate.js插件以及Jquery，在最后加上这个插件的方法名来引用。$('form').validate();
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery.validate.js的简单用法</title> </head> <body> <form action=""> <p>用户名：<input class="required" type="text" minlength="3" name="user" />(*)</p> <p>电子邮件：<input class="required email" type="text" name="email" />(*)</p> <p>网址：<input class="url" type="text" name="url" /></p> <p><input type="submit" value="提交" /></p> </form> </body> <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="jquery.validate.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('form').validate(); }) </script> </html>
像以上class中的类名，required是字段不能为空；email是需要符合邮件格式；url是需要符合网址格式（必须带http://），后边minlength是需要输入最少字符,还有挺多参数，详情请看其文档。
二、当然以上是使用的控件方式去验证的，也可以使用JS 对象 键值对传参方式来设置：（上边表单里就不用再写class，直接用name来传值即可）
<form action=""> <p>用户名：<input name="user" />(*)</p> <p>电子邮件：<input type="text" name="email" />(*)</p> <p>网址：<input type="text" name="url" /></p> <p><input type="submit" value="提交" /></p> </form>
<script type="text/javascript"> $(document).ready(function(){ $('#reg').validate({ rules:{ user:{ required:true, minlength:2, }, email:{ email:true, }, url:{ required:true; } }, messages:{ user:{ required:'账号不得为空', minlength:'账号不得小于2位', }, }, }); }) </script>
结合默认验证规则
此插件下载路径：链接: https://pan.baidu.com/s/1o8wcmkq 密码: grdp
二、如果你用了bootstrap框架，那么你可以用bootstrapValidator表单验证插件，更建议用这个哟~具体请查看：（链接转自）http://www.cnblogs.com/v-weiwang/p/4834672.html?ptvd