Javascript 如何隐藏optgroup/option元素？

有没有办法隐藏

选项

或

optgroup

HTML元素？我尝试在jQuery中调用

hide（）

，并使用常规Javascript设置

style.display='none'

它适用于Firefox，但不适用于任何其他浏览器。实际上，从DOM中删除它们是可行的，所以也许有一种方法可以在删除每个DOM元素时保存它们，并将它们重新插入相同的位置

我的HTML如下所示：

<select name="propsearch[area]" id="propsearch_area">
    <option value="0">- Any -</option>
    <optgroup label="Bristol">
        <option  value="Hotwells">Hotwells</option>
        <option  value="Montpelier">Montpelier</option>
    </optgroup>
    <optgroup label="Cardiff">
        <option  value="Heath">Heath</option>
        <option  value="Roath">Roath</option>
    </optgroup>
    <optgroup label="Exeter">
        <option  value="Pennsylvania Road">Pennsylvania Road</option>
        <option  value="Lower North Street">Lower North Street</option>
    </optgroup>
    <optgroup label="Swansea">
        <option  value="Brynmill">Brynmill</option>
        <option  value="Uplands">Uplands</option>
    </optgroup>
</select>

-任何-
热井
蒙彼利埃
荒地
漫游
宾夕法尼亚路
北下街
布林米尔
高地

我觉得这个解决方案对我来说很好：

再做一次选择

$("#footer_canvas").after('<select id="parkingLot"></select>');

当您想“隐藏”某个optgroup时，只需将其“停放”在这个隐藏的select中

$('#VehicleVehicleCategoryId optgroup[label="kategorie L"]').appendTo("#parkingLot");

同样的方法，你可以使它可见。

---

这只是我的解决方案的一小部分，对我来说很好。

如果R0MANARMY是正确的，您可以禁用它们，

$（'optgroup[label=Swansea]'）。attr（'disabled'，true）

似乎可以正常工作。@MaxShawabkeh

上的

禁用的
属性仅从IE8开始工作。另一种方法是将数据存储在JSON对象中，您可以操作该对象，而不是隐藏的选择。
$('#VehicleVehicleCategoryId optgroup[label="kategorie L"]').appendTo("#parkingLot");