html - 如何在 Bootstrap 中使用按钮显示输入无效的验证边框？

Question

Bootstrap 如何处理输入(带有按钮)上的无效验证错误边框？来自 Bootstrap 文档 I read以下内容:

Bootstrap includes validation styles for error, warning, and success states on form controls. To use, add .has-warning, .has-error, or .has-success to the parent element. Any .control-label, .form-control, and .help-block within that element will receive the validation styles.

根据上面提供的任何信息，我管理了以下 fiddle :

<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<div class="container">
  <div class="row">
    <div class="col-md-12">
      <div class="form-group has-error">
        <label for="exampleInput1">Label</label>
        <div class="input-group">
          <input type="text" class="form-control">
          <div class="input-group-btn">
            <button type="button" class="btn btn-default" ><span class="glyphicon glyphicon-question-sign"></span></button>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

我应该如何修复按钮的侧边框？

Answer 1

有两个条件可以尝试。如果您可以使用 Bootstrap ，只需将 btn-default 替换为 btn-danger 或创建 border style 并将其应用于按钮