javascript - 如何通过创建红色边框来突出显示无效的 jquery 输入

Question

如何突出显示输入 jquery 验证中的错误？

请帮帮我

$(function () {
    // Setup form validation on the #register-form element
    $("#register-form").validate({
        // Specify the validation rules
        rules: {
            firstname: "required",
            lastname: "required",
            month: "required",
            day: "required",
            year: "required",
            gender: "required",
            email: "required",
            phone: {
                required: true,
                minlength: 11
            },
            password: {
                required: true,
                minlength: 6,
                equalTo: "#confirm-password"
            },

            submitHandler: function (form) {
                form.submit();
            }
        });
    });

Answer 1

这两个元素放在 jquery validate 中以突出显示错误

errorElement: "div",
        errorClass: 'help-block animation-slideDown',
        errorPlacement: function (error, element) {
            error.insertAfter(element);
            element.addClass("edited");
           element.parents(".form-control-focus   > div").append(error);
            error.insertAfter(element);
            element.parents(".form-group  > div").append(error);
        },
        highlight: function (e)
        {
            $(e).closest(".input-group ").parent().removeClass("has-error").addClass("has-error"), $(e).closest(".help-block").remove();
            $(e).closest(".form-group").removeClass("has-error").addClass("has-error"), $(e).closest(".help-block").remove();
        },