我正在使用jQuery验证插件,我写了以下代码,如果不是有效的话,将元素的(< input>)父(< label>)添加到一个类,以及插入实际的错误元素(< span>)之前的< br> ;.
HTML …
<label>
text<br><input>
</label>
…和jQuery.
$("#form_to_validate").validate({
rules: {
...
},errorElement: "span",errorPlacement: function(error,element) {
element.parent().addClass('error');
error.insertBefore(element.parent().children("br"));
}
});
所以,如果一个表单元素不验证,它变成：
<label class="error">
text<span>error text</span><br><input>
</label>
但是,如果一个字段的内容被更正并变得有效,那么这个工作很好,类显然不会从父进程中删除(实际上,这个错误元素也不会被显示：none; CSS属性).如何检查元素是否有效并删除其父类？
任何帮助将不胜感激 ！
已编辑：添加更多信息.
解决方法
经过一些更加沉重的挖掘,我发现答案在我的鼻子下,但不幸的是对我来说,很隐蔽.该插件具有内置的突出显示功能(惊喜,惊喜).通常它会突出显示/取消高亮显示元素,但可以轻松地将其转换为在元素的父项上工作：
$("#form_to_validate").validate({
rules: {
...
},element) {
error.insertBefore(element.parent().children("br"));
},highlight: function(element) {
$(element).parent().addClass("error");
},unhighlight: function(element) {
$(element).parent().removeClass("error");
}
});
我希望这会帮助别人！
