Скрытие и отображение нескольких выборок

Question

У меня есть 2 выбора, и я хочу удалить, основываясь на значениях из второго выбора, значения из первого. Например: если я выбираю значения 1 и 2 из второго выбора, я хочу, чтобы значения 2,3,4,5 были скрыты, а если во втором значении выбора равно 3, я хочу, чтобы значения 1,2,3 были скрыты:

выбор1:

<select name="select1"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
</select> 

выбор2:

<select name="select2"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 

Это код для сокрытия в случае, когда выбран 1 или 2:

var ary=[2,3,4,5]; 
$('[name=select1] option').filter(function(){ 
return ($.inArray(parseInt(this.value),ary) >-1);}).hide(); 

Этот код работает для скрытия, но у меня есть проблема. Когда код скрывает 2,3,4,5 по значениям 1 и 2, выбор значения 3 во втором выборе показывает мне только значение 1, потому что другие скрыты. Я решил это с помощью show(). А потом 2,3,4,5 предъявляются, но я не могу скрыть значение 1 из-за возвращения: // Я попробовал это, он не будет работать:

var ary=[4,5]; 
var ary2=[1]; 
$('[name=select1] option').filter(function(){ 
return ($.inArray(parseInt(this.value),ary) >-1);}).hide()&&($.inArray(parseInt(this.value),arry2) >-1);}).show(); 

Я также пытался вызвать другую функцию который всегда будет обновлять select1, показывая все значения, и в этом случае использовать только шкуры, я думаю, что это было бы правильно, но я не знаю, как его решить?

Answer 1

Fiddle это здесь: http://jsfiddle.net/8ZuGE/

Обратите внимание, что добавление элементов списка, я думаю, может быть немного более эффективным, но вы получите идею:

var $resetValues = $('#select1').find("option"); 

$('#select2').on('change', function() { 
    var selected = $("option:selected", this).val(); 
    // Reset select1 
    $('#select1').empty(); 
    $resetValues.each(function() { 
     $('#select1').append($(this)); 
    }); 

    var array; // Hidden values 
    if(selected > 0 && selected < 3) { 
     array = [2,3,4,5]; 
    } else { 
     array = [1,2,3]; 
    } 

    $('#select1 option').filter(function() { 
     return ($.inArray(parseInt($(this).val()), array) != -1); 
    }).remove(); 
});