【问题标题】:Required attribute on inputs in bootstrap is not working [duplicate]引导程序中输入的必需属性不起作用[重复]
【发布时间】:2015-09-19 11:06:29
【问题描述】:

为什么 bootstrap 中输入的 required 属性不起作用?

<input type = "text" id = "thisisatext" class= "form-control" required>

【问题讨论】:

  • 我在网页上有几个文本框。
  • 但是我没有使用提交按钮,我使用了
  • 如果你想要必填字段工作,它必须是一个表单。首先在表单和按钮onClick()之间理解清楚。我的回答解释清楚
  • 您能推荐一些我可以在不使用表单的情况下用于验证空输入字段的东西吗? :)

标签: javascript html twitter-bootstrap validation required


【解决方案1】:

使用这种类型,它会工作Validator

<form data-toggle="validator" role="form">
  <div class="form-group">
    <label for="inputName" class="control-label">Name</label>
    <input type="text" class="form-control" id="inputName" placeholder="Cina Saffary" required>
  </div>
  <div class="form-group">
    <label for="inputTwitter" class="control-label">Twitter</label>
    <div class="input-group">
      <span class="input-group-addon">@</span>
      <input type="text" pattern="^([_A-z0-9]){3,}$" maxlength="20" class="form-control" id="inputTwitter" placeholder="1000hz" required>
    </div>
    <span class="help-block with-errors">Up to 20 letters, numbers and underscores</span>
  </div>
  <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">
    <label for="inputPassword" class="control-label">Password</label>
    <div class="form-group col-sm-6">
      <input type="password" data-minlength="6" class="form-control" id="inputPassword" placeholder="Password" required>
      <span class="help-block">Minimum of 6 characters</span>
    </div>
    <div class="form-group col-sm-6">
      <input type="password" class="form-control" id="inputPasswordConfirm" data-match="#inputPassword" data-match-error="Whoops, these don't match" placeholder="Confirm" required>
      <div class="help-block with-errors"></div>
    </div>
    </div>
  </div>
  <div class="form-group">
    <div class="radio">
      <label>
        <input type="radio" name="underwear" required>
        Boxers
      </label>
    </div>
    <div class="radio">
      <label>
        <input type="radio" name="underwear" required>
        Briefs
      </label>
    </div>
  </div>
  <div class="form-group">
    <div class="checkbox">
      <label>
        <input type="checkbox" id="terms" data-error="Before you wreck yourself" required>
        Check yourself
      </label>
      <div class="help-block with-errors"></div>
    </div>
  </div>
  <div class="form-group">
    <button type="submit" class="btn btn-primary">Submit</button>
  </div>
</form>

【讨论】:

  • 如果我不使用表格怎么办?我使用 将数据处理为 javascript (ajax) 到 php,这就是我不使用提交表单的原因。
猜你喜欢
  • 1970-01-01
  • 2013-04-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-07-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多