0

这就是我想要的

当用户选择选项 1 时，显示 dropdown2。当用户选择选项 2 时，显示 dropdown3。

用户提交表单后，Option1/2 和从 dropdown2/3 中选择的值应该可用。

我尝试过的：我保持 ID 不变，但是隐藏/显示变得很棘手。保持 ID 不同，隐藏/显示很容易，但是表单提交提交两个 dropdown2/3 的值。

<script type="text/JavaScript">    
    function show(id) {  
        if (document.getElementById(id).style.display == 'none') {  
            document.getElementById(id).style.display = '';  
        }  
    }  

    function hide(id) {  
        document.getElementById(id).style.display = 'none';  
    }    
</script>

<form  action="showdetails.php" method="post">
  <select class="dropdown1" name="desire">
    <option selected="selected" onclick="show('ID1');hide('id2');">Option 1</option>
    <option onclick="hide('ID1');show('ID2');">Option 2</option>
  </select>
  <select id="dropdown2" class="dropdown" name="action">
    <option selected="selected">Value1</option>
    <option>Value 2</option>
    <option>Value 3</option>
  </select>
  <select id="dropdown3" class="dropdown" name="action" >
    <option>Room</option>
  </select>
  <input type="submit" id="submit" title="Go"/>
</form>
4

2 回答 2

1

只需将相同的名称属性添加到两个下拉列表但分配不同的 id。id 对于隐藏或显示下拉列表很有用，同名对于在服务器端访问下拉列表的值很有用。您可以在 formCollection 中获取下拉列表的值。

于 2013-05-27T18:04:07.487 回答
1

您可以使用该disabled属性来确保您select的其中一个未提交。你肯定希望这两个有不同id的 s，但是如果你给他们一个相同的name，并且禁用一个，那么只会提交一个：

function show(id) { 
    var dropdown = document.getElementById(id); 
    if (dropdown.style.display == 'none') {  
        dropdown.style.display = '';
        dropdown.removeAttribute('disabled');  
    }  
}  

function hide(id) {  
    var dropdown = document.getElementById(id); 
    dropdown.style.display = 'none'; 
    dropdown.setAttribute('disabled', 'disabled'); 
}
于 2013-05-27T18:06:40.383 回答