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

【问题标题】：Mobile Selection List - Hide Default Option移动选择列表 - 隐藏默认选项
【发布时间】：2013-11-09 02:07:54
【问题描述】：

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

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

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

【问题讨论】：

已发布 - 非常基本，但可能会提供更好的理解。

标签： jquery html css mobile

【解决方案1】：

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

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

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

【讨论】：

【解决方案2】：

简单去掉默认选项的显示怎么样：

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

【讨论】：

【解决方案3】：

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

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

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

【讨论】：

我想标记我的选择，所以它要求回复。我在主要问题中添加了代码，希望对您有所帮助。