Как скрыть элементы optgroup/option?

Есть ли способ скрыть элементы HTML option или optgroup? Я попытался вызвать 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>

Ответы

Ответ 1

Я понял, что это решение отлично подходит для меня:

Сделайте другой выбор, например

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

затем скройте его

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

Если вы хотите "спрятать" некоторую группу optgroup, просто "откройте" ее в этом скрытом выборе.

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

То же самое можно сделать видимым. Это всего лишь фрагменты моего решения, которые отлично подходят для меня.