默认选择选项为空白

Question

我有一个很奇怪的要求，其中要求我默认在HTML的下拉菜单中没有选择任何选项。然而，

我不能用这个

<select>

  <option></option>

  <option>Option 1</option>

  <option>Option 2</option>

  <option>Option 3</option>

</select>

因为，为此，我必须进行验证才能处理第一个选项。有人可以在没有将第一个选项实际包含在select标签中的情况下帮助我实现此目标吗？

Answer 1

也许这会有所帮助<select>&nbsp; &nbsp; <option disabled selected value> -- select an option -- </option>&nbsp; &nbsp; <option>Option 1</option>&nbsp; &nbsp; <option>Option 2</option>&nbsp; &nbsp; <option>Option 3</option></select>-- select an option --将默认显示。但是，如果您选择一个选项，则将无法再次选择它。您也可以通过添加一个空白来隐藏它 option<option style="display:none">因此它将不再显示在列表中。选项2如果您不想编写CSS并期望与上述解决方案具有相同的行为，请使用：<option hidden disabled selected value> -- select an option -- </option>

Answer 2

您可以使用Javascript实现此目的。尝试以下代码：的HTML<select id="myDropdown">&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; <option>Option 1</option>&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; <option>Option 2</option>&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; <option>Option 3</option>&nbsp; &nbsp; &nbsp;</select>&nbsp;JSdocument.getElementById("myDropdown").selectedIndex = -1;或JQuery$("#myDropdown").prop("selectedIndex", -1);