如何使HTML下拉选项无法点击

Question

<form action="submit.php" method="post">
<select name="input"> 
<option value="Athletics:">Athletics:</option>
<option value="Running">Running</option>
<option value="Paragliding">Paragliding</option>
<option value="Swimming">Swimming</option>
</select> 
<input type="Submit" value="Next">
</form>

我试图让"田径运动:"不能点击,所以用户必须选择他们的特定运动.帮助表示感谢,谢谢.

Answer 1

如果您计划在此下拉菜单中添加更多不是"Athlectics"的选项,我认为您在这里寻找的内容实际上是<optgroup>:

<select>
  <option value=""></option>
  <optgroup label="Athlectics">
   <option value="Running">Running</option>
   <option value="Paragliding">Paragliding</option>
   <option value="Swimming">Swimming</option>
  </optgroup>
</select>

它看起来像这样:

这对于在下拉列表中对选项组进行分类非常有用."Athlectics"不是一个可选择的选择.

否则我认为您应该使用"Athlectics"作为此字段的标签并将其从选项中删除:

<label>Athlectics: <select>...</select></label>

您应始终使用标签以便于访问,并且通常会改善您的UI.

如果您真的只想禁用某个选项,请使用以下disabled属性:

<option value="Athletics:" disabled>Athletics:</option>

参考:

• <optgroup>:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/optgroup
• <label>:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label
• disabled属性:http://www.w3.org/TR/html5/disabled-elements.html
  另外:禁用属性的正确值