隐藏bootstrap-select下拉列表中的默认选定项目

Question

我似乎无法找到解决方案。我试图隐藏bootstrap-select下拉列表中的默认选定项目，如下所示：

<select class="selectpicker">
  <option selected>Mustard</option>
  <option>Ketchup</option>
  <option>Relish</option>
</select>

在这种情况下，＆＃39; Mustard＆＃39;是默认选择的值，不应显示在下拉列表中。任何人都可以帮我这个吗？

更新： 除了ObsidianAge接受的答案之外，我想要注意的是，如果你在bootstrap-select.js中使用它，你应该将CSS更改为：

.dropdown-menu.inner > li.selected {
  display: none;
}

Answer 1

假设您只想在下拉列表中隐藏它，并且不默认情况下将其隐藏为可见，您只需使用CSS display: none 来定位选项的selected属性：

.selectpicker > option[selected] {
  display: none;
}

<select class="selectpicker">
  <option selected>Mustard</option>
  <option>Ketchup</option>
  <option>Relish</option>
</select>

请注意，一旦更改，用户将无法（轻松）再次选择此选项。

希望这有帮助！ ：）