我的 jquery 验证错误消息未显示为红色，我的错误是否缺少内置样式？答案

【问题标题】：My jquery validate error message doesn't show in red, is my error missing built in styling?我的 jquery 验证错误消息未显示为红色，我的错误是否缺少内置样式？
【发布时间】：2016-10-23 22:10:19
【问题描述】：

我正在使用 jquery validate 来验证元素中的 3 个属性（minlength、maxlength、required）。

<input id="jumbotronSearch" type="text" class="form-control input-lg" placeholder="Location" required maxlength="50" minlength="4"/>

但是当显示错误消息时，它会显示为黑色，而不是红色。

从演示和显示验证错误消息的其他线程和站点看来，消息应该是红色的，元素的边框也会是红色的！？？我是否必须自己设置这个样式，或者我是否缺少一些文件或 jquery validate 的配置参数以使山雀显示为红色？

这是错误消息的样子，看到消息是黑色的，不是红色的，并且元素的边框不是红色的！

【问题讨论】：

此插件不包含任何样式表。如果是红色，则与 jQuery Validate 无关。
检查你的validation.js文件是否在你用来做错误检查的js文件之上，如果它在一个单独的文件中。我有一个类似的问题，我的 js 文件在特定页面上验证表单高于 validation.js 文件，所以它让我有点失望，其他验证错误日志以红色突出显示，而这个不是.我只是将 js 文件向上移动，在validation.js 文件下面进行错误处理，它起作用了！希望这对其他人也有帮助。

标签： jquery css jquery-validate

【解决方案1】：

...似乎消息应该是红色的，元素的边框也会是红色的！？？我必须自己设计这个样式吗...

是的，由于该插件不包含 CSS 样式表，因此您必须自己设置样式。

默认情况下，此插件将名为 error 的类应用于无效元素及其消息标签，并将名为 valid 的类应用于已验证元素。

演示：jsfiddle.net/06cLoL8c/

快速浏览官网，您可以看到没有包含任何 CSS 文件：

jqueryvalidation.org

从查看演示和显示验证错误消息的其他线程和站点看来，消息应该是红色的...

这些其他人可能正在使用 Bootstrap 等框架，其中可能包含已经针对 .error 和 .valid 类的 CSS。否则，您可以使用 validClass 和 errorClass 选项将这些类重命名为您想要的任何名称。

这是与上面相同的演示，但在 CSS 中应用了荒谬的样式：

jsfiddle.net/y06ur48o/

您应该阅读所有可用插件选项的文档：jqueryvalidation.org/validate/

【讨论】：

@user1186050，我不知道。为什么不阅读我链接的文档并相应地匹配类？
我不相信我正在寻求的效果（主要是用红色突出显示边框）来自引导程序。我很确定它来自某种类型的验证操作。
@user1186050，验证插件不带有 CSS...它只是添加/删除 error 和 valid 类。时期。如果您不相信，请inspect the code 确认事实。