空白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>

• selected将此选项设为默认选项。
• disabled使此选项无法点击。
• style='display: none'使此选项不会在旧版浏览器中显示。请参阅：隐藏属性的Can I Use文档。
• hidden使此选项不会显示在下拉列表中。

Answer 2

您可以使用selectedIndex：http://jsfiddle.net/R9auG/将-1设置为.prop。

对于较旧的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脚本的香草。您可以对其进行测试here。

<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删除第一个选项，如果它是空白的。

Answer 7

对于纯粹的html @isherwood有一个很好的解决方案。对于jQuery，给你的选择下拉一个ID然后用jQuery选择它：

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

然后使用此jQuery清除页面加载时的下拉列表：

$(document).ready(function() {
    $('#myDropDown').val(''); 
});

或者将它放在一个函数中：

$('#myDropDown').val(''); 

完成您正在寻找的内容，如果您需要在不重新加载页面的情况下删除下拉列表，则很容易将其放入可能在您的页面上调用的函数中。

Answer 8

您可以尝试使用此代码段

$("#your-id")[0].selectedIndex = -1

它对我有用。