JQuery Validator自定义错误样式及CSS校验（动态元素）

对jQuery validator也不熟，使用的时候碰到两个问题，列下来，做一个记录

这两个官方文档里面都介绍了的

1、原生的错误样式跟系统的样式不太搭，要自定义一个错误的样式

官方参考文档

$(".selector").validate({
  errorClass: "invalid"
});

 就给他指定了一个叫做invalid的错误样式

 

2、动态创建的元素，他的名称是动态的，怎么给他添加校验规则

这时候，可以给动态创建的元素一个CSS，然后自定义一个CSS的校验规则

官方参考文档

//1、创建一个自定义的校验规则
jQuery.validator.addMethod("discount", function(value, element) {   
	 var tel = /^(\d(\.\d{1,2})?|10|10.0|10.00)$/;
	 return this.optional(element) || (tel.test(value));
 }, "必填字段，不可大于10，可精确到小数点后两位");

 //2、创建一个CSS校验规则，在里面使用上面创建的这个规则
 jQuery.validator.addClassRules("discount", {
	required: true,
	discount: true
});

//3、在动态创建元素的时候给他一个discount样式
<input type="text" leaseTerm="'+days+'" name="days_'+days+'" value="" class="form-control input-sm discount" placeholder="">