Question

我有一个下拉列表，当我选择'Arrangement'时，另一个下拉列表需要显示。当您再次选择其他字段时，第二个下拉列表需要“重置/不选择”。

我该怎么做？

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/

Answer 1

我认为您正在寻找的答案已经发布在这里：

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

至少这是用jquery做的一种方法。

Answer 2

这有效：

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

});

下拉列表中的选择项目需要显示/隐藏另一个下拉列表

2 个答案: