根据其他选择选项禁用选择选项

Question

我有2个选择：

<select id="select_1" name="tipo_carta">
 <option value="1">90gr</option>
 <option value="2">150gr</option>
 <option value="3">270gr</option>
</select>

<select id="select_2" name="stampa">
 <option value="0">Fronte</option>
 <option value="1">Fronte e Retro</option>
</select>

当我选择选项“270gr”（来自select_1）时，我会禁用选项“Fronte e Retro”（来自select_2）

我怎样才能做到这一点？

Answer 1

由于其他答案并不完全“简洁”，而且主要是基于jQuery，我在这里实现了2个线程Mootools解决方案 ：

$('select_1').addEvent('change', function(e) {
    $$('#select_2 option[value=1]').set('disabled',e.target.value == 3);
});

将它放在您的domready或初始化UI事件的任何位置。

对于极其古老的Mootools版本，您必须更加冗长：

$('select_1').addEvent('change', function(e) {
    $$('#select_2 option[value=1]').each(function(el){ el.disabled = (e.target.value == 3);});
});

Answer 2

尝试这个..

$('#select_1').change(function(){
  if($(this).val() == 3){
    $('#select_2').find('option:eq(1)').prop('disabled',true);
  }else{
     $('#select_2').find('option:eq(1)').prop('disabled',false);
  }
});

在这里小提琴

Answer 3

使用以下

$('#select_1').change(function() {
   if($(this).val() == '3') {
        $("#select_2 option:contains('Fronte e Retro')").attr({disabled:true});
    } else {
       $("#select_2 option:contains('Fronte e Retro')").attr({disabled:false});
    }

}）;