JQueryValidate验证和Form表单的配合

最近遇到很多Form表单的项目，都是必须要加表单验证的。自己就总结了一些小方法，方便以后查看。

第一种：这是bootstrap和JQueryValidate配合

html代码：

<form class="form-horizontal" id="reportedLoss_add_form">
  <div class="form-group" style="margin-top: 15px;">
    <label for="dz_provident_fund_text" class="col-sm-2 control-label">*公积金最新基准利率</label>
    <div class="col-sm-8">
      <input type="text" class="form-control" name="dz_provident_fund_text" id="inputEmail3" placeholder="">
    </div>
  </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <button type="submit" class="btn btn-default dz_provident_fund_btn">保存</button>
    </div>
  </div>
</form>

js代码：

$('#reportedLoss_add_form').validate({
		rules:{
//	通过name属性或许元素,然后自定义验证（可以更改validate框架里面的自定义验证）
			dz_provident_fund_text:{
				required:true
			}
		},
		messages:{
//	通过name属性或许元素,然后自定义验证
			dz_provident_fund_text:{
				required:'不得为空'
			}
		},
//		验证通过之后执行
		submitHandler: function() {
//			$('#form').hide();
//			$('#p').show();
//			打开新页面
//			window.location.href = 'JQ验证.html';
		}
	});

第二种：这是JQuery和JQueryValidate配合

html代码：

<form action="JQ验证.html" id="form">
	<input type="text" name="name1" id="" value="" />
	<br />
	<br />
	<br />
	<br />
	<input type="button" name="btn" id="btn" value="提交" />
</form>

js代码：

$(function(){
				$('#btn').click(function(){
					$("#form").submit();
				});
				$('#form').validate({
					rules:{
//						通过name属性或许元素,然后自定义验证（可以更改validate框架里面的自定义验证）
						name1:{
							required:true
						}
					},
					messages:{
//						通过name属性或许元素,然后自定义验证
						name1:{
							required:'不得为空'
						}
					},
			//		验证通过之后执行
					submitHandler: function() {
//						$('#form').hide();
//						$('#p').show();
//						打开新页面
						window.location.href = 'JQ验证.html';
					}
				});
			});