为什么“选择”选项被隐藏？

Question

我有一个这样的 HTML 选择：

<select name="something">
    <option value="a">1</option>
    <option value="b">2</option>
    <option value="c">3</option>
</select>

我注意到 jquery 将选项解释为隐藏的 HTML 标记。当我必须像本例中那样删除真正的隐藏标签时，问题就来了：

<form action="#" id="f">
    <select name="something">
        <option value="a">1</option>
        <option value="b">2</option>
        <option value="c">3</option>
    </select>
    <p style="display:none">hello world</p>
    <any_tag style="display:none">some text</any_tag>
</form>

如果我执行这个：

$("#f :hidden").remove();

所有选项都被删除。问题是为什么 jquery 会删除选项？什么是最适合删除 only 隐藏标签的选择器？ （好坏选项标签）

这里是a test。

Answer 1

您可以添加应该已经存在的功能：P

$("#f :hidden:not(option)").remove();

Answer 2

查看这个 jQuery 错误报告：http://bugs.jquery.com/ticket/6293

特别注意：

由 john 于 3 个月前更改
状态从打开变为关闭
分辨率设置为 wontfix

考虑到除了 Firefox 之外的所有浏览器 说它是隐藏的——它似乎是相反的。那 话虽这么说，我不太确定你想用什么来实现 :hidden/:visible 在选项元素上。看起来你应该可能 使用 :selected 代替。不要认为这是我们的东西 会花费很多周期。

作为这种情况的解决方案，我会选择 @Joseph 已经提供的内容：

$("#f :hidden:not(option)").remove();

..按预期工作：http://jsfiddle.net/thirtydot/G4Qnr/4/

Answer 3

试试：

$(":hidden").not("option")

Answer 4

在这种情况下，您可以简单地将隐藏元素包装在某种容器中，然后使用 jQuery 从容器中删除元素：

<div id="foo">
    <p style="display:none;">hello world</p>   
</div>

然后，在 jQuery 中你可以这样做：

$("#foo :hidden").remove();

编辑

这是另一种方法：

$("#f :hidden").not("option").remove();

Answer 5

不确定原因，但您可以使用 :not jQuery 选择器进行补救。

$("#f :not(option):hidden").remove();

http://jsfiddle.net/G4Qnr/2/