一尘不染

如何使用JavaScript隐藏选择选项?(跨浏览器)

javascript

这应该工作:

$('option').hide(); // hide options

它可以在Firefox中运行,但不能在Chrome中运行(可能未在IE中运行,未经测试)。

一个更有趣的示例:

<select>
    <option class="hide">Hide me</option>
    <option>visible option</option>
</select>
<script type="text/javascript">
// try to hide the first option
$('option.hide').hide();

// to select the first visible option
$('option:visible').first().attr('selected', 'selected');
</script>

是将选项元素与DOM分离的唯一选择吗?我需要稍后再显示给他们,所以这不会很有效。


阅读 263

收藏
2020-05-01

共1个答案

一尘不染

不幸的是,您不能option在所有浏览器中隐藏元素。

在过去,当我需要这样做时,我就设置了它们的disabled属性,就像这样…

$('option').prop('disabled', true);

然后,我使用了这段CSS,在浏览器中支持隐藏的位置…

select option[disabled] {
    display: none;
}
2020-05-01