显示和隐藏选择选项

我创建了一个非常基本的窗体，它有2个下拉列表。显示和隐藏选择选项

每个列表包含相同的条目：

<option value='1234:0'>Closed</option> 
<option value='4567:2'>Open</option> 
<option value='6857:1'>Dead</option> 
<option value='9856:1'>Alive</option> 
<option value='0000:0'>Other</option>

如果选择下拉1中的条目，则该条目必须从下拉2

如果使用不同的条目是在下拉1中选择去除，然后应该从下拉2被移除和原始条目返回如果没有在下拉1中选择到下拉2

，那么所有的选项应在下拉2所示

我创建了一个FIDDLE，表明我有多远...它不是很远。

任何人都可以帮忙吗？

由于

来源

2014-09-29 Rocket

如果你想用文字你可以试试这个

$(function(){ 

    $('#test').change(function() { 

     var selected = $('option:selected', this).text(); 

     $("#test2 option").each(function(){ 

      if($(this).text() == selected) { 

       $(this).hide(); 

      } else { 

       $(this).show(); 
      } 

     }) 

    }); 

});

来源

2014-09-29 11:53:06 tliokos

谢谢 - 这似乎工作:) – Rocket 2014-09-29 11:54:35

@火箭不客气。如果你发现它有用，你可以接受答案 – tliokos 2014-09-29 11:56:49

通过使用text（）也可以吗？ – 2014-09-29 11:58:08

由于每个选项的值是相同的，则可以使用value属性来选择在第二选择的匹配。

$('form').on('change', 'select[name="test"]', function() { 
    var selected = $(this).val(); 
    $("#test2 option").show(); 
    $("#test2 option[value='" + selected + "']").hide(); 
});

Demo

来源

2014-09-29 11:46:19

你能解释一下试试这个

$(function(){ $('#test').change(function() { var selected = $(this).val(); $("#test2 option").show(); $("#test2 option[value='" + selected + "']").hide(); }); });

？我没有明白你的观点。 – 2014-09-29 11:50:44

选择**'关闭'**，然后选择另一个 - **'关闭'**值应重新设置。不是。而第二个下拉菜单根本不隐藏任何值。 – urbz 2014-09-29 11:52:41

@urbz查看编辑答案。 – 2014-09-29 11:54:57

显示和隐藏选择选项

回答

相关问题