jQuery验证:隐藏错误消息并更改无效字段背景颜色

时间:2012-10-30 03:51:22

标签: javascript jquery forms jquery-validate

这是sample form 如何自定义表单以使其不显示任何错误消息,而是更改无效字段背景颜色?

试了这个无济于事:

$("form").validate({
  errorPlacement: function(error, element) {
     $(element.error).css("background","red");
   }
 })

2 个答案:

答案 0 :(得分:5)

您只需要两行CSS:

label.error {display: none !important;}
.error {background: #F00;}

答案 1 :(得分:0)

您可以通过处理validate plugin中的invalidHandler回调来执行此操作:

<强>代码:

$('#commentForm').validate({
    invalidHandler: function() {
        setTimeout(customizeErrors, 200);
    }
});

function customizeErrors() {
    $('label.error').each(function() {
        $(this).prev().addClass('has-error');
        $(this).prev().attr('title', $(this).text());
    });
    $('label.error').remove();
}

演示: http://jsfiddle.net/2LwTa/

注意:错误消息理想情况下不应该工具提示,因为这意味着只使用键盘的用户将永远不会看到它。