jquery - 移动选择列表 - 隐藏默认选项

Question

在移动选择列表中，如何隐藏/删除列表中的第一个默认显示项？查看手机选择时会弹出一个包含所有选项的窗口，如何删除默认的“选择一个选项”项？

<select name="test">
    <option value="">Default Label</option>
    <option value="val1">Value 1</option>
    <option value="val2">Value 2</option>
</select>

当移动窗口弹出时，我想省略“默认标签”作为选项（不是禁用它，而是完全删除它）。

Answer 1

我个人最喜欢的方法是设置默认选项disabled

<select name="test">
    <option value="" disabled>Default Label</option>
    <option value="val1">Value 1</option>
    <option value="val2">Value 2</option>
</select>

这样，一旦用户单击下拉菜单，他们就必须选择其中一个选项，因为他们不再可以使用默认选项。

Answer 2

如果“选择”是指选择元素，那么您可以只包含一个空白选项。

<select>
  <option value=""></option>
  <option value="1">Selection 1</option>
  <option value="2">Selection 2</option>
</select>

这将给出一个空元素的效果，直到用户做出选择。

Answer 3

如何简单地删除默认选项的显示：

select .default
{
    display: none;
}

并将默认类添加到默认值<option>

<select name="test">
    <option value="" class="default">Default Label</option>
    <option value="val1">Value 1</option>
    <option value="val2">Value 2</option>
</select>

jsFiddle