Jqueryvalidation：如何使字段变红

我使用jquery和jquery.validate.cs（jQuery Validation Plugin 1.8.0）来validation表单。 现在它在一个字段旁边显示一条消息：“这是必填字段”。

我也希望每个领域都变成红色。 我该怎么做？ 谢谢！

Answer 1

没有任何自定义配置，您可以这样做：

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

• 应用于无效输入的默认类是error
• 已validation的输入的默认类是valid 。

这些类也适用于错误标签，因此在编写CSS时要注意这一点。

• 使用默认类进行演示： http ： //jsfiddle.net/wesley_murch/j3ddP/2/

validation插件允许您配置这些类名，因此您可以执行以下操作：

 $("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找到配置选项

Answer 2

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

使用errorClass参数添加.invalid类：

 input.error { color: red; } 

Answer 3

使用Firebug查看错误元素的类是什么，然后使用css使其变为红色：

 .error-label { color: red; } 

Answer 4

我在官方文档中找到了这段代码。 在这个例子中，我们高亮显示错误输入及其标签。

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

您可以根据需要轻松修改它。
请参阅此处的完整文档： https ： //jqueryvalidation.org/validate/#highlight