javascript - 如何验证电子邮件和最小长度验证

Question

我想仅使用 bootstrap 来验证电子邮件输入，该输入具有正确的格式以及名字和密码的最小长度验证。

在这里，我已经对输入进行了必需的字段验证，但我不知道如何添加电子邮件和最小长度验证。

引用:http://getbootstrap.com/docs/4.0/components/forms/?#validation

HTML

 <div class="form-group col-6">
            <label for="validationCustom01">First name</label>
            <input type="text" class="form-control" minlength="4" id="validationCustom01" placeholder="First name" required>
            <div class="invalid-feedback">
              * First name is required
            </div>
          </div>
          <div class="form-group col-6">
            <label for="validationCustom02">Last name</label>
            <input type="text" class="form-control" id="validationCustom02" placeholder="Last name" required>
            <div class="invalid-feedback">
              * Last name is required
            </div>
          </div>
          <div class="form-group col-6">
            <label for="email">Email</label>
            <input type="text" class="form-control" id="email" placeholder="Email" required>
            <div class="invalid-feedback">
              * Email is required
            </div>
          </div>
          <div class="form-group col-6">
            <label for="validationCustom03">Password</label>
            <input type="text" class="form-control" minlength="5" id="validationCustom03" placeholder="Password" required>
            <div class="invalid-feedback">
              * Password is required
            </div>
          </div>

Answer 1

您必须使用 JS 验证(还有服务器端验证)。HTML 验证可在所有浏览器中轻松编辑。在 HTML 中，您可以使用 HTML5 中的模式，例如 <input pattern=".{8,20}">这将是从 8 个字符到 20 个字符的检查长度。