jquery - 如何更改有效表单字段的类 - jQuery 表单验证插件

Question

我正在使用 bassistance jQuery 表单验证插件。

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

http://jquery.bassistance.de/validate/demo/

我制作了一个带有表单字段并设置规则的表单；

JavaScript

$(document).ready(function() {
    $.validator.setDefaults({
        submitHandler: function() {
          alert("submitted!");
        }
    });
    var validator = $("#testform").validate({
        rules: {
            field1: "required",
        },
        messages: {
            field1: "",
        },
        error: function(element) {
            element.addClass("error");
        },
        success: function(label) {
            label.addClass("checked");
        }
    });
});

CSS

#testform input{
  border: solid 2px black;
}
#testform input.error{
  border: solid 2px #CC0000;
}
#testform input.checked{
  border: solid 2px #094AB2;
}

HTML

<form id="testform" name="testform">
<input id="field1" name="field1" type="text" value="">
<input id="field2" name="field2" type="text" value="">
<input type="submit" value="submit"/>
</form>

错误函数工作正常。但成功的功能并没有为输入 type=text 添加样式，而是出现默认样式(黑色边框而不是蓝色)。我该如何解决这个问题？

这是工作 fiddle

Answer 1

将#testform input.checked更改为#testform input.valid。我通过提交表单并使用开发人员工具或 firebug 检查类来得到这个。我看到类名更改为有效且未检查

这是一个Live Demo