如何隐藏optgroup/option元素？

Question

有没有办法隐藏option或optgroupHTML元素？我试过调用hide()jQuery,还使用常规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>

Answer 1

我认为这个解决方案适合我:

做另一个选择例如

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

然后隐藏它

$("#parkingLot").hide();

当你想"隐藏"一些optgroup时,只需将它"停放"在这个隐藏的选择中.

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

以同样的方式让它可见.这只是我的解决方案的片段,对我来说很好.