2014-02-18 84 views
0

我有一个下拉菜单,当我选择“安排”时,其他下拉菜单需要可见。 当您再次选择其他字段时,第二个下拉列表需要“重置/不选”。在下拉菜单中选择项目需要显示/隐藏另一个下拉菜单

我该怎么做?

的HTML:

<table width="300" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
    <td>Select:</td> 
    <td align="right"> 
    <select name="mydropdown" class="formfield"> 
     <option value="">No selection</option> 
     <option value="Diner">Diner</option> 
     <option value="Lunch">Lunch</option> 
     <option value="Arrangement">Arrangement</option> 
    </select> 
    </td> 
    </tr> 
    <tr> 
    <td height="10"></td> 
    <td> </td> 
    </tr> 
    <tr class="go-hide"> 
    <td>Type arrangement</td> 
    <td align="right"> 
    <select class="formfield"> 
     <option value="">No selection</option> 
     <option value="All you can eat Tapas">All you can eat Tapas</option> 
     <option value="High Tea">High Tea</option> 
     <option value="Combinaties">Combinations</option> 
    </select> 
    </td> 
    </tr> 
</table> 

这里举例: http://jsfiddle.net/fourroses666/R555U/1/

回答

0

我认为你正在寻找的答案已经张贴在这里:

Show/Hide <select> dropdown, with jQuery, based on value

在乐这是用jQuery来做到这一点的一种方法。

+0

谢谢!我想我会提出另一个关于“不选择”的问题,但这基本上是我想要做的! – fourr

+0

我会的,但首先我喜欢有1件事排序。如果你看这里:http://jsfiddle.net/fourroses666/stAAm/515/当选择安排2,然后选择组合安排需要被取消/重置。 – fourr

+0

因为当我发送表单时,我会看到选择排列2和组合3 3 – fourr

0

这工作:

$(document).ready(function(){ 

    $('#keuze').change(function() { 
     if ($('#keuze option:selected').text() == "Arrangement"){ 
      $('.go-hide').hide(); 
      $('#arrangement').show(); 
      $('#combinatie option:eq(0)').attr('selected','selected'); 
     } else if ($('#keuze option:selected').text() == "Combinatie"){ 
      $('.go-hide').hide(); 
      $('#combinatie').show(); 
      $('#arrangement option:eq(0)').attr('selected','selected'); 
     } else { 
      $('.go-hide').hide(); 
      $('#arrangement option:eq(0)').attr('selected','selected'); 
      $('#combinatie option:eq(0)').attr('selected','selected'); 
     } }); 

}); 
相关问题