0

我正在使用来自 formvalidator.net 的最新版本 2.2x 的 Jquery 插件以及 bootstrap 4。

jsfiddle:https ://jsfiddle.net/adarshmadrecha/ckpLsqod

<body>
<script>
$.validate();
</script>

<div class="container mt-5">
<form>
  <div class="form-group">
    <label for="#txt01"> First Name </label>
    <input type="text" id="txt01" class="form-control" data-  validation="length alphanumeric" data-validation-length="min4">
  </div>

  <div class="form-group">
    <label for="#txt02"> Email </label>
    <input type="text" id="txt02" class="form-control" data-validation="email">
  </div>

  <div class="form-group">
    <input type="button" class="btn btn-info" value="Submit">
  </div>
</form>
</div>
</body>

我无法弄清楚我的 HTML / javascript 到底出了什么问题。我尝试了 Bootstrap 3,但也没有用。

ps:这是我第一次创建 HTML 表单。

4

1 回答 1

1

尝试使用以下代码,在你的小提琴中添加这个 cdn 表单验证器 js https://cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.3.26/jquery.form-validator.min.js,现有一中未找到,抛出404。

<body>
  <script>
  function validateForm(){
    $.validate();
  }
  </script>

  <div class="container mt-5">
    <form>
      <div class="form-group">
        <label for="#txt01"> First Name </label>
        <input type="text" id="txt01" class="form-control" data-validation="length alphanumeric" data-validation-length="min4">
      </div>

      <div class="form-group">
        <label for="#txt02"> Email </label>
        <input type="text" id="txt02" class="form-control" data-validation="email">
      </div>

      <div class="form-group">
        <input type="button" class="btn btn-info" value="Submit" onclick="validateForm();">
      </div>
    </form>
  </div>

</body>

小提琴:https ://jsfiddle.net/ckpLsqod/11/

于 2017-11-03T07:01:09.583 回答