Twitter bootstrap 跳过某些引导4输入的验证反馈

通过以下操作，我可以验证我的表单，但我还没有找到一种方法，使特定字段（例如文本输入或复选框）不会显示验证反馈，而其他字段则会显示验证反馈

我的意思是：在验证表单时，如何使某些特定字段跳过获取

：valid

或

：invalid

伪类，或者即使它们确实获得了应用于它们的伪类，如何使它们不被视为其他字段的格式

可能有一个类与

相反。是否验证了可应用于特定字段的

引导版本：v4.0.0-beta.3
您可以将
.was validated
添加到要显示验证的输入的父元素中

例如，如果使用
.form group
类将输入放置在
div
中，则可以执行以下操作：

 <div class="form-group was-validated">
   <label for="formGroupExampleInput">Example label</label>
   <input type="text" class="form-control" id="formGroupExampleInput" placeholder="Example input">
  </div>


示例标签

如果任何父元素具有
.was validated
类，则验证样式适用，具有
was validated
类的父元素是否为表单并不重要。我看不到它的文档，但它会随着引导CSS避免针对特定HTML元素而改变。
尝试将
formnovalidate=“formnovalidate”
添加到提交按钮。这将跳过
required
属性，并允许您提交任何引导验证。
非必填表单字段有一个伪类
：valid
。因此，如果将类
添加到表单中，则所有类都将突出显示为有效

要仅突出显示重新查询的字段，您不应使用默认验证，而应仅检查以下必要字段：

if ($(this).val() != "" && $(this).prop("validity").valid) {
  $(this).addClass("is-valid");
} else {
  $(this).addClass("is-invalid");
}

如果您使用bootstrap4，它将在代码执行后正确高亮显示这些字段

您可以在
上检查它，因为默认情况下非必填字段有效
您可以通过添加到输入
。表单控件
类例如：
无验证

如果您正在使用npm并导入bootstrap，则可以使用bootstrap变量

.form-control.no-validate:valid {
    border-color: $input-border-color;
    padding: $input-padding-x;
    background: $input-bg;
}

如果没有，您可以只添加默认值：

.form-control.no-validate:valid {
    border-color: #ced4da;
    padding-right: .75rem;
    background: none;
}

我的客户要求我不要将非必填字段标记为空。
另一方面，我必须将前端和后端验证结合起来，以
防止黑客攻击，便于对数据库进行验证

下面的示例基于BS4，thymeleaf，并受@ksiger在其JSFIDLE中的想法启发（见上文），但必须进行修改以符合我的标准

因此，首先让我们检查表单（注意类）：

这就是全部的魔力。
所有表单字段上都有“必填”吗？@痛处是没有。未标记为必需的字段实际上是我在验证表单时不希望将其涂成绿色的字段。我也有同样的问题。我在登录表单上有一个“记住我”复选框，不适合将其涂成绿色，验证不应该查看它。这会自动添加验证视觉效果。OP试图从视觉上排除，这基本上与您的建议相反。BobbyScon是100%正确的，这与该人想要的视觉相反询问者不想跳过表单上的验证。他们想跳过某些项目的视觉反馈。简单有效。回答得好。
 <form id="myForm" action="#" th:action="@{/formurl}" th:object="${myForm}"
       method="post" novalidate class="needs-custom-validation">

$(function () {
    // validate field on change
        $(':input').change(function (event) {
            var isValid = checkField(this);
            // ... I'm doing something here ...
            return isValid;
        });

    // check field validity
        checkField = function (fld) {
            var isRequired = $(fld).prop('required');
            var isValid = $(fld).prop("validity").valid;
            var isEmpty = $(fld).val() == "";
            $(fld).removeClass("is-valid").removeClass("is-invalid");
            if (isValid) {
                if (!isEmpty)
                    $(fld).addClass("is-valid");
                return true;
            } else {
                $(fld).addClass("is-invalid");
                return false;
            }
        }

        /* form validation */
        checkForm = function (f) {
            var isValid = true;
            $(f).find("input, textarea, select").each(function () {
                isValid = checkField(this) && isValid; // "&&" is shortcut
            });
            return isValid;
        }

        $('[class="needs-custom-validation"]').submit(function (event) {
            if (!checkForm(this)) {
                event.preventDefault();
                event.stopPropagation();
                return false;
            }
            // call ajax here or let it bubble to the submit button
        });
});