jquery.validate自定义验证--成功提示与择要提示

1. 自定义验证--成功提示



1） 添加选项

errorClass: "unchecked"，
validClass: "checked"，
errorElement: "span"，
errorPlacement: function （error， element） {
	if （element.parent（）.find（"span[for=""" + element.attr（"id"） + """]"） != null） {
		element.parent（）.find（"span[for=""" + element.attr（"id"） + """]"）.remove（）;
	}
	error.appendTo（element.parent（））;
}，
success: function （label） {
	label.removeClass（"unchecked"）.addClass（"checked"）;
}，

2）设置样式

input.unchecked{border: 1px ＃E6594E dotted;}
span.checked {
  padding: 3px 5px 3px 21px;margin-left: 10px;margin-top: 0px;margin-bottom: 3px;adisplay: inline;
  height: 25px;line-height: 1px;font-size: 12px;aborder: 1px solid ＃E6594E;white-space: nowrap;
  text-align: left;color: ＃E6594E;background:url（"/Common/Sys/Cfg/images/checked.gif"） no-repeat 3px;/* ＃FCEAE8 */
}
span.unchecked {
  padding: 3px 5px 3px 21px;margin-left: 10px;margin-top: 0px;margin-bottom: 3px;adisplay: inline;
  height: 25px;line-height: 1px;font-size: 12px;border: 1px solid ＃E6594E;white-space: nowrap;
  text-align: left;color: ＃E6594E;background: ＃FCEAE8 url（"/Common/Sys/Cfg/images/unchecked.gif"） no-repeat 3px;
}

2. 自定义验证--择要提示



1） 添加选项

errorContainer: container，
errorLabelContainer: $（"ul"， container），
wrapper: ""li""，
meta: "validate"，
errorClass: "unchecked"，
validClass: "checked"，

2） 设置样式

input.unchecked{border: 1px ＃E6594E dotted;}
span.checked {
  padding: 3px 5px 3px 21px;margin-left: 10px;margin-top: 0px;margin-bottom: 3px;adisplay: inline;
  height: 25px;line-height: 1px;font-size: 12px;aborder: 1px solid ＃E6594E;white-space: nowrap;
  text-align: left;color: ＃E6594E;background:url（"/Common/Sys/Cfg/images/checked.gif"） no-repeat 3px;/* ＃FCEAE8 */
}
span.unchecked {
  padding: 3px 5px 3px 21px;margin-left: 10px;margin-top: 0px;margin-bottom: 3px;adisplay: inline;
  height: 25px;line-height: 1px;font-size: 12px;border: 1px solid ＃E6594E;white-space: nowrap;
  text-align: left;color: ＃E6594E;background: ＃FCEAE8 url（"/Common/Sys/Cfg/images/unchecked.gif"） no-repeat 3px;
}
div.container {
	background-color: ＃eee;
	border: 1px solid red;
	margin: 5px;
	padding: 5px;
}
div.container ol li {
	list-style-type: disc;
	margin-left: 20px;
}
div.container { display: none }
.container label.error {
	display: inline;
}

3） 添加择要标识表记标帜

<div class="container">
    <h4>There are serious errors in your form submission， please see below for details.</h4>
    <ul></ul>
</div>