1

我对验证插件很感兴趣。当有人点击提交按钮并且未填写必填字段时,相关字段的边框颜色将变为红色。然而,我的问题是我还希望它旁边的文本颜色发生变化。这是我的结构:

<div class="row">
    <label for="name">Name*</label>
    <input type="text" id="name" name="name">
</div>
.form.a input.error {border:2px solid #eb053b;}

我现在如何选择标签元素来更改文本颜色?使用 CSS 是不可能的,因为您无法选择父元素,但我不知道如何使用 jQuery 来做到这一点。

4

2 回答 2

0

您可以在单击提交按钮时触发此事件

if(jQuery('.form.a input').css('border')==2px solid #eb053b){
    jQuery(this).siblings('label').css('color','#eb053b');
}
于 2013-07-06T22:04:06.840 回答
0

正如我在评论中提到的,jquery 验证器默认在输入框后添加一个标签,并带有一个类“错误”。虽然我还没有找到阻止验证器执行此操作的技巧,但这是我在表单中练习的内容。
HTML:

<div class="row">
    <input type="text" id="name" placeholder="Name (required)" name="name">
</div>

CSS:

.form.a input.error {border:2px solid #eb053b;}
label.error { color: #ebo53b;}

小提琴

这将在红色输入框之后的标签中产生有意义的错误消息。
可以使用rulesjquery 验证器的选项自定义错误消息,标签的位置(之前或之后)由errorPlacement选项更改。

如果以及当我找到您问题的确切解决方案时,我会更新我的答案。

于 2013-07-06T22:43:34.617 回答