javascript - 如何在输入中获取 jQuery 验证错误类

Question

我正在使用 jQuery 验证插件，但遇到错误消息显示方式的问题。通过查看开发人员工具，我发现错误消息是 .error，因此我正在尝试修改它。我希望错误消息显示在未通过验证的字段的输入中。正如您在我的代码中所见，我希望错误位于右侧。

我这样做是为了解决错误:

.error {
    color: red;
    display: inline !important;
    vertical-align: top;
    margin-bottom: 5px;
}
label.error {
    /*margin-left: 10%;*/
    right: 5%;
}

我尝试这样做而不是 label.error

input.error {
   /*margin-left: 10%;*/
   right: 5%;
 }

但这并没有帮助。

如果我可以为这个问题添加更多信息，请告诉我。

Answer 1

添加你的风格

.error {position : absolute}

结束然后把边距和填充到你想要的地方

更新答案

在您的站点中，您应该像下面这样编辑 html

<form action="" autocomplete="on" method="POST" id="project-information-form" novalidate="novalidate">
    <div class="input-group">
        <input type="text" class="input-borderless error" id="title-roll" name="title" placeholder="Title/Role" aria-required="true">
        <label id="title-roll-error" class="error" for="title-roll">Please enter your title</label>
    </div>
...

然后设置样式 .input-group {position : relative} 和 .error {position : absolute}

如果您不想将您的input 和您的error 绑定(bind)到一个div，您需要通过javascript 计算您的input 位置。在您的 javascript 中，您为 .error 元素设置了位置。但我认为那种方式毫不费力