空白HTML SELECT下拉列表中没有空白项目

Question

如何实现subj？

我写的时候:

<form>
  <select>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>
</form>

那么默认选中的项目是"aaaa"

我写的时候:

<form>
  <select>
     <option value=""></option>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>
</form>

然后默认选中的项目为空白,但此空白项目显示在下拉列表中.

我如何使用隐藏在下拉列表中的默认空白值实现SELECT标记？

Answer 1

只需使用禁用和/或隐藏属性:

<option selected disabled hidden style='display: none' value=''></option>

为什么不接受这个简单的解决方案.有用. (13认同)
Webkit似乎不支持"隐藏"属性 (6认同)
实际上IE 11确实显示"隐藏"选项. (2认同)
正如[我可以使用](http://caniuse.com/#search=hidden)中所提到的,`hidden`属性实际上是`display:none`,所以为了支持旧浏览器:`<选项已禁用隐藏样式= 'display:none'value =''> </ option>` (2认同)

Answer 2

你可以通过设置selectedIndex来-1使用.prop:http://jsfiddle.net/R9auG/.

对于较旧的jQuery版本,请使用.attr而不是.prop:http://jsfiddle.net/R9auG/71/.

Answer 3

简单地使用

<option value="" selected disabled>Please select an option...</option>

将在没有脚本的任何地方工作,并允许您同时指导用户.

Answer 4

<select>
     <option value="" style="display:none;"></option>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>

Answer 5

这是使用纯JavaScript执行此操作的简单方法.这是pimvdb发布的jQuery脚本的香草.你可以在这里测试一下.

<script type='text/javascript'>
  window.onload = function(){
    document.getElementById('id_here').selectedIndex = -1;
  }
</script>

.

<select id="id_here">
  <option>aaaa</option>
  <option>bbbb</option>
</select>

确保"id_here"在表单和JavaScript中匹配.

Answer 6

你不能。他们根本不那样工作。下拉菜单必须始终选择其选项之一。

您可以（尽管我不推荐）监视更改事件，然后使用 JS 删除第一个选项（如果它为空）。