Скрыть параметры в элементе select, не работающем в IE? [дубликат]

Возможные Дубликаты:
скрыть опцию выбора в IE с помощью jQuery

Итак, как вы можете видеть ниже, у меня есть два выбора элементов. Первый имеет два значения, 1.4 и 1.7. В зависимости от того, какой параметр выбран, я хочу отключить определенные параметры во втором элементе select. Он отлично работает в chrome, но IE является сукой (как обычно!).

есть идеи, что случилось?

<p>
    <label style="width: 155px; display: inline-block;">Height</label>
    <select name="height">
        <option value="1.4">1.4</option>
        <option value="1.7">1.7</option>
    </select>
</p>
<p>
    <label style="width: 155px; display: inline-block;">Amount</label>
    <select name="slanor">
        <option class="four" value="2">2</option>
        <option class="four seven" value="3">3</option>
        <option class="seven" value="4">4</option>
    </select>
</p>


<script>
$(document).ready(function() {
    check();

    $('select[name=height]').change(function() {
        check();
    });

    function check() {
        var slanor = $('select[name=slanor]');
        var currHeight = $('select[name=height]').val();

        if(currHeight == '1.4') {
            slanor.find('option').hide();
            slanor.find('.four').show();
        } else {
            slanor.find('option').hide();
            slanor.find('.seven').show();
        }
    }
});
</script>
9
internet-explorer jquery select

3 ответов

понятие скрытые options на select не существует в IE. Вам придется вручную удалить и повторно добавить записи, что может быть несколько неудобно.

другим решением было бы также отключить элементы:

slanor.find(option).hide().prop('disabled', true);

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

: если ваша проблема точно так, как вы описали, и есть только два варианта, что ваш скрипт будет отличаться, самым простым решением может быть hide и show два разных выпадающих списка полностью, в зависимости от того, какой параметр выбран.

13

призвание .hide () в jQuery добавляет display: none к элементу. Я сомневаюсь, что это стандартный HTML, который вы можете скрыть таким образом.

вы можете использовать этот код вместо:

slanor.empty();
if (currHeight == '1.4') {
    slanor.append($('<option'>).val('2').text('2'));
    slanor.append($('<option'>).val('3').text('3'));
}
else {
    slanor.append($('<option'>).val('3').text('3'));
    slanor.append($('<option'>).val('4').text('4'));
}
1

тег option не поддерживает атрибут отображения css. Что и делает show () / hide (). Лучше всего удалить и воссоздать параметры по мере их необходимости. Или, я думаю, вы можете добавить их к другому скрытому объекту и вытащить их обратно, когда вам нужно, чтобы они полностью сформировались.

таким образом, у вас будет что-то вроде

$("option").appendTo($("#myhiddenselect"));
$(".four").appendTo($("#myvisibleselect"));
0