jQuery «видимый» не работает во всех браузерах, но в Firefox

Question

Я сделал очень простую скрипку здесь , и вы можете проверить это в разных браузерах.

Работает только в Firefox. Другими словами, кажется, что $('#select-tag-id option:visible') не работает в других браузерах. В чем дело? Это ошибка jQuery?

Код:

<select id='items'>
    <option value='1' style='display: none;'>One</option>
    <option value='1' style='display: block;'>Two</option>
    <option value='1' style='display: block;'>Three</option>
    <option value='1' style='display: none;'>Four</option>
</select>

и JavaScript (код jQuery):

$(function(){
    alert($('#items option:visible').length);
});

Answer 1

Это не ошибка jQuery - просто (еще одно) отличие браузера.

IE не позволит вам установить display:none для элементов option ( style.display = 'none' не работает натеги option ).

Если вы посмотрите на fiddle в FF и IE, вы увидите, что <select> по-прежнему содержит все четыре элемента в IE, но толькодва в FF, независимо от присутствия jQuery.

Решение, вероятно, состоит в том, чтобы фактически удалить элементы и заменить при необходимости.

Answer 2

Действительно, :hidden и :visible не работают на <option> *

. Вы можете попробовать использовать disabled="disabled", см .:

http://jsfiddle.net/sZR2f/7/