Jquery验证插件如何将错误类添加到标签

时间:2013-01-31 13:49:22

标签: jquery jquery-validate

使用jquery validate插件,我试图覆盖它的默认行为。这是我的html的一个例子:

<table>
<tr>
  <td>
    <label for="my-input>Name</label>
  </td>
</tr>
<tr>
  <td>
    <input type="text" class="required" id="my-input />
  </td>
</tr>
</table>

我希望valadate做的就是将类.error添加到现有标签,然后在字段通过验证后将其删除。

感谢。

2 个答案:

答案 0 :(得分:12)

这是默认行为,您只需要停止页面上显示的错误消息。您可以通过覆盖errorPlacement

来完成此操作
$('form').validate({
 errorPlacement: function () { }
});

修改

抱歉误读了问题位 - 下面的代码有效,但可能有更好的方法

$('form').validate({
    // make sure error message isn't displayed
    errorPlacement: function () { },
    // set the errorClass as a random string to prevent label disappearing when valid
    errorClass : "bob",
    // use highlight and unhighlight
    highlight: function (element, errorClass, validClass) {
        $(element.form).find("label[for=" + element.id + "]")
        .addClass("error");
    },
    unhighlight: function (element, errorClass, validClass) {
        $(element.form).find("label[for=" + element.id + "]")
        .removeClass("error");
    }
});

以上代码来自options docs

上的突出显示示例

答案 1 :(得分:2)

errorElement: "label",
errorPlacement: function(error, element) {
    error.insertBefore(element.parent().children("br"));
},
highlight: function(element) {
    $(element).parent().addClass("error");
},
unhighlight: function(element) {
    $(element).parent().removeClass("error");
}