Jquery - 三个选择列表,如果选择了一个值,则取消激活另外两个

时间:2010-08-10 22:39:52

标签: jquery drop-down-menu selectlist

我有三个下拉选择列表,当选择一个列表中的值时,我希望其他两个显示为灰色且不活动。我在我正在尝试的每个选择列表周围有id包装器,但是因为我是jquery的新手,所以我没有走得太远。

4 个答案:

答案 0 :(得分:4)

这样的事情应该有效:

$(function() {
  var $selects = $('#select1, #select2, #select3');
  $selects.change(function() {
    // disabled the other two
    $selects.not(this).attr('disabled', 'disabled');
  });
});

<小时/> 更新版本:

$(function() {
  var $selects = $('#select1, #select2, #select3');
  $selects.change(function() {
    // disable or enable the other two
    $selects.not(this).attr('disabled', $(this).val() === '' ? '' : 'disabled');
  });
});

答案 1 :(得分:0)

您可以这样做:

$('#wrappers').change(function(){
  $('#select1').attr('disabled', true);
  $('#select2').attr('disabled', true);
});

其中wrappers是select元素的id,当您选择一个值时,其他两个将被禁用,其ID分别为select1select2,例如:

<select id="wrappers">.........
<select id="select1">.........
<select id="select2">.........

Here is working example

答案 2 :(得分:0)

我假设您有三个,如果选择了三个中的任何一个,则其他两个应该禁用。

function toggleOthers(x) {
var select = new Array('#wrapper1','#wrapper2','#wrapper3');

for (int i = 0; i < select.length; i++ )
    if ($(x).attr('id')!=select[i])
        $(x).attr('disabled','disable');
}

HTML: <select onchange='toggleOthers(this);' id='wrapper1'> etc...

答案 3 :(得分:0)

如果您使用id为#wrapper

的div包装器进行选择
$('#wrapper select').each(function(i,select){
   $(select).change(function(){
        $(this).attr('class','enabled').siblings().attr('class','disabled');
    })
})