jQuery验证：如何将字段设为红色

如何解决jQuery验证：如何将字段设为红色

| 我正在使用jquery和jquery.validate.cs（jQuery验证插件1.8.0）来验证表单。现在，它在字段旁边显示一条消息：“这是必填字段”。 我还希望每个字段都变成红色。我该怎么办？谢谢！     

解决方法

        没有任何自定义配置，您可以执行以下操作：

select.error,textarea.error,input.error {
    color:#FF0000;
}

应用于无效输入的默认类是

error

经过验证的输入的默认类别为

valid

。 这些类也适用于错误标签，因此在编写CSS时要注意这一点。 带有默认类的演示：http://jsfiddle.net/wesley_murch/j3ddP/2/ 验证插件允许您配置这些类名，因此您可以执行以下操作：

$(\"form\").validate({
   errorClass: \"my-error-class\",validClass: \"my-valid-class\"
});

.my-error-class {
    color:#FF0000;  /* red */
}
.my-valid-class {
    color:#00CC00; /* green */
}

带有自定义类的演示：http://jsfiddle.net/wesley_murch/j3ddP/1/ 可以在http://docs.jquery.com/Plugins/Validation/validate找到配置选项     ,        

$(\"#myform\").validate({
   error: function(label) {
     $(this).addClass(\"error\");
   },});

使用errorClass参数添加.invalid类：

input.error {
    color: red;
}

    ,        使用Firebug查看error元素的类是什么，然后使用CSS将其变为红色：

.error-label {
    color: red;
}

    ,        我已经在官方文档中找到了此代码。 在此示例中，我们同时突出显示了错误的输入及其标签。

$(\"#myform\").validate({
   highlight: function(element,errorClass,validClass) {
    $(element).addClass(errorClass).removeClass(validClass);
    $(element.form).find(\"label[for=\" + element.id + \"]\")
    .addClass(errorClass);
  },unhighlight: function(element,validClass) {
    $(element).removeClass(errorClass).addClass(validClass);
    $(element.form).find(\"label[for=\" + element.id + \"]\")
    .removeClass(errorClass);
  }
});

您可以根据需要轻松对其进行修改。 在此处查看完整的文档：https://jqueryvalidation.org/validate/#highlight