jQuery Validation插件问题

问题

$("#commentForm").validate({
	rules:{
		username:{
			required:true,
			minlength:2
		}
	},
	messages:{
		username:{
			required:"请输入用户名！",
			minlength:"用户名必须大于2个字符"
		}
	},
	errorElement: "em", 
	success: function(label) { //验证通过后执行
		//label指向上面那个错误提示信息标签em
		label.text(" ")				//清空错误提示消息
			.addClass("success");	
	}
});

使用JQuery Validation设置输入无效时，会向错误标签添加“invalid”类。然后在有效时添加“success”类。但是一旦有效后它无效，它不会删除“success”类。

1>无效 - 标签具有invalid类

2>有效 - 标签具有 'invalid success' 类

3>无效 - 标签具有 'invalid success' 类

原因

当验证元素验证成功之后所添加的类，与验证成功后错误标签所添加的类名相同的时候，错误标签的所添加的类才会随着验证元素是否有效进行动态变化。

解决方法

Validation的validClass可以为验证元素设置验证成功之后所添加的类。

height="265" width="800" scrolling="no" title="Validation插件-验证通过时添加类无法动态移除" src="//codepen.io/madman0621/embed/KGqzgq/?height=265&theme-id=light&default-tab=js,result" allowfullscreen="true"> See the Pen Validation插件-验证通过时添加类无法动态移除 by madman0621 ( @madman0621) on CodePen.