如何选择所需表单的元素，同时在初始框中显示选择元素的名称（仅限 HTML）？答案

【问题标题】：How do you select element of a form required while also displaying the name of select element in the initial box (HTML Only)?如何选择所需表单的元素，同时在初始框中显示选择元素的名称（仅限 HTML）？
【发布时间】：2018-04-24 13:17:15
【问题描述】：

我正在使用 HTML 创建一个简单的表单，但遇到了表单验证问题。我试图让单词 Month、Day、Year 出现在下拉选择框中，但不允许它考虑单词 Month、Day、Year 作为有效选项。请查看我的代码。它在提交表单时一直接受这些值作为选项。

<form>
    <label>
    Birthday:
      <select name="month" required>
        <option value="month" disabled selected hidden>Month</option>
        <option>Jan</option>
        <option>Feb</option>
        <option>Mar</option>
      </select>

      <select name="day" required>
        <option value="day" disabled selected hidden>Day</option>
        <option>1</option>
        <option>2</option>
        <option>3</option>
      </select>

      <select name="year" required>
        <option value="year" disabled selected hidden>Year</option>
        <option>1990</option>
        <option>2000</option>
        <option>2010</option>
      </select>
    </label>
  <input type="submit">
  </form>

【问题讨论】：

你能具体说明问题吗？选项标签中没有值属性！

标签： html forms select

【解决方案1】：

<form>
    <label>
    Birthday:
      <select name="month" required>
        <option value="month" disabled selected hidden>Month</option>
        <option value="January">Jan</option>
        <option value="February">Feb</option>
        <option value="March">Mar</option>
      </select>

      <select name="day" required>
        <option value="day" disabled selected hidden>Day</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>

      <select name="year" required>
        <option value="year" disabled selected hidden>Year</option>
        <option value="1990">1990</option>
        <option value="2000">2000</option>
        <option value="2010">2010</option>
      </select>
    </label>
  <input type="submit">
  </form>

你在找这个吗？

【讨论】：

您的代码帮助我找出我的编码出错的地方。完成重新编码后，我会将我的代码添加到此线程中。谢谢！！！
只要确保对基础知识有很好的理解！ :)
谢谢。我还处于学习阶段。我还有很多东西要学。
@MichaelBruley 如果我的回答对您有帮助，请接受它作为回答并投票！ ;)

【解决方案2】：

解决方案...

<!DOCTYPE html>
<html>
<head>
  <title>User Registration Form</title>
  <meta charset="utf-8">

</head>


<h2>Signup For a New Account</h2>
<form id="signupForm">
  <label for="first">First Name</label>
  <input name="first" id="first" type="text" placeholder="John" required>

  <label for="last">Last Name</label>
  <input name="last" id="last" type"="text" placeholder="Smith" required>

  <div>
    <label for="male">Male</label>
      <input id="male" name="gender" type="radio" value="male" required>
    <label for="female">Female</label>
      <input id="female" name="gender" type="radio" value="female" required>
    <label for="other">Other</label>
      <input id="other" name="gender" type="radio" value="other" required>
  </div>

  <div>
    <label>
    Email:
      <input type="email" name="email" placeholder="Your Email" required>
    </label>
    Password:
      <input type="password" name="password" required pattern=".{5,10}" required title="Must be between 5 and 10 characters">
  <div>

  <div>
    <label>
    Birthday:
      <select required aria-required="true" id="birthdaymonth" name="birthdaymonth">
        <option value="" hidden>Month</option>
        <option value="1">January</option>
        <option value="2">February</option>
        <option value="3">March</option>
        <option value="4">April</option>
        <option value="5">May</option>
        <option value="6">June</option>
        <option value="7">July</option>
        <option value="8">August</option>
        <option value="9">September</option>
        <option value="10">October</option>
        <option value="11">November</option>
        <option value="12">December</option>
      </select>

      <select required aria-required="true" id="birthdayday" name="birthdayday">
        <option value="" hidden>Day</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
        <option value="11">11</option>
        <option value="12">12</option>
        <option value="13">13</option>
        <option value="14">14</option>
        <option value="15">15</option>
        <option value="16">16</option>
        <option value="17">17</option>
        <option value="18">18</option>
        <option value="19">19</option>
        <option value="20">20</option>
        <option value="21">21</option>
        <option value="22">22</option>
        <option value="23">23</option>
        <option value="24">24</option>
        <option value="25">25</option>
        <option value="26">26</option>
        <option value="27">27</option>
        <option value="28">28</option>
        <option value="29">29</option>
        <option value="30">30</option>
        <option value="31">31</option>
      </select>

      <input type="text" name="birthdayyear" placeholder="Year (ie. 1991)" required pattern=".[0-9]{3}" required title="Must be 4 digits (Ie. 1989)">
    </label>
  </div>

  <div>
    <label for="agreed">I agree to the terms and conditions:</label>
    <input id="agreed" name="agreed" type="checkbox" required>
  </div>

  <input type="submit" value="Submit Form">
</form>


</body>
</html>

【讨论】：