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

时间:2013-05-17 07:55:09

标签: javascript mootools

我有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)

我怎样才能做到这一点?

3 个答案:

答案 0 :(得分:2)

由于其他答案并非完全“简洁”,而且主要基于jQuery,我implemented a 2 liner Mootools solution here

$('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);});
});

答案 1 :(得分:0)

试试这个..

$('#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);
  }
});

fiddle here

答案 2 :(得分:0)

使用以下

$('#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});
    }

});