javascript - 如何验证 javascript 中的空字段并将错误消息传递给警报 Bootstrap

Question

我想使用 JavaScript 验证字段并将错误消息传递给 Bootstrap 警报。我怎样才能实现这个目标？有人可以帮忙吗？这是我的 JavaScript 函数:

function validateValues() {
    var f = document.frm;

    if (f.UsrID.value == "") {
        alert('Please fill in User ID'); < --How to pass this error message to Bootstrap alert ?
            f.UsrID.focus();
        return false;
    }
}

这是我想显示错误消息的地方

<div class="alert alert-danger fade in">
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span></button>
    <strong>Error message:</strong>
</div>

Answer 1

仅 Bootstrap 就可以验证您的表单，无需任何其他脚本:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

  <form data-toggle="validator" role="form">
  <div class="form-group">
    <label for="inputEmail" class="control-label">Email</label>
    <input type="email" class="form-control" id="inputEmail" placeholder="Email" data-error="Bruh, that email address is invalid" required>
    <div class="help-block with-errors"></div>
  </div>
  <div class="form-group">
    <button type="submit" class="btn btn-primary">Submit</button>
  </div>
</form>

希望这有帮助