Question

我有一个输入类型为“ email”和输入类型为“ password”的表单，在提交未通过电子邮件验证的表单时都具有必需的属性（它接受简单文本，例如“ abcde”），并且尽管已写入必填属性，该字段也接受空值

 <form> 

    <div>
    <input type="radio" name="role" value="tbl_staff_details" checked />Institute/Branch
      <input type="radio" name="role" value="tbl_student_details" />Student/Parent

   <div id="msg" style="color: red;margin-top: 1%"></div>

</div>
  <div class="form-group has-feedback" style="margin-top: 5%">
    <input type="email" class="form-control" placeholder="Email" id="mail" required />
    <span class="glyphicon glyphicon-envelope form-control-feedback"></span>
  </div>
  <div class="form-group has-feedback">
    <input type="password" class="form-control" placeholder="Password" id="pwd" required />
    <span class="glyphicon glyphicon-lock form-control-feedback"></span>
  </div>
  <div class="row">
    <div class="col-xs-8">
      <div class="checkbox icheck">
        <label>
          <input type="checkbox"> Remember Me
        </label>
      </div>
    </div>
    <!-- /.col -->
    <div class="col-xs-4">
      <button type="button" class="btn btn-primary btn-block btn-flat" id="signin">Sign In</button>
    </div>
    <!-- /.col -->
  </div>

Answer 1

您描述的检查将在提交表单时进行。

您没有提交按钮。

删除type="button"（以便按钮元素使用默认的type="submit"）。

Answer 2

要使“必需”属性生效，您必须具有按钮类型“提交”，并且所有这些都必须放在同一“表单”部分中，就像我快速检查的那样，您错过了按钮类型“提交”并且我也看不到你的

Answer 3

好的，看来您这里有很多问题。我会猜测您的要求，因为目前尚不清楚，但是我确实看到您这里有很多问题。

首先：如果要验证电子邮件，则需要通过代码进行实际验证。浏览器不会为您神奇地做到这一点。您需要设置这些约束。您可以使用HTML中的pattern属性轻松完成此操作。参见https://www.w3schools.com/tags/att_input_pattern.asp

或者，您也可以使用javascript验证内容。

第二：您可能正在通过某种非标准方式提交表单。如果您希望“必需”属性起作用，那么通常需要使用-

提交表单

<input type="Submit">

Answer 4

我只是尝试简单地运行您的代码

<input type="email" class="form-control" placeholder="Email" id="mail" required />

它对我来说很好用，电子邮件字段为必填项。

这是代码示例。

<form>
  Username: 

  <input type="email" class="form-control" placeholder="Email" id="mail" required />

  <input type="submit">
</form>

<p><strong>Note:</strong> The required attribute of the input tag is not supported in Internet Explorer 9 and earlier versions, or in Safari.</p>

</body>
</html>

您刚刚想拥有类型为Submit的按钮。

HTML输入属性不起作用

4 个答案: