使用javascript根据另一个选择框更改选择框的内容

Question

如何根据第一个选择框的值更改第二个选择框的内容。 没有jQuery，只有JavaScript启用了基于第一个选择框（div2）的各种输入的第二个选择框。只有JavaScript，没有jQuery，没有内部HTML（如果使用开关）。

<script>   //javascript
    function showHide(elem) {
        if(elem.selectedIndex != 0) {
            //hide the divs
            for(var i=0; i < divsO.length; i++) {
                divsO[i].style.display = 'none';

            }
            //unhide the selected div
            document.getElementById('div'+elem.value).style.display = 'block';


        }
    }



    window.onload=function() {
        //get the divs to show/hide
        divsO = document.getElementById("details").getElementsByTagName('div');
        disO = document.getElementById("details").getElementsByTagName('di');
    }

</script>

<div id="div2"> //select boxes
    <select size="1" id="rambo" name="comm-name" selected="selected" onchange="showhide(this)" >
        <option value="" selected="selected">-Select Office-</option>
        <option value="3">HEAD OFFICE</option><option value="4">REGIONAL OFFICE</option>
        <option value="5">DIVISIONAL OFFICE</option><option value="6">BRANCH OFFICE</option>
        <option value="7">SERVICE CENTER</option><option value="8">EXTENSION COUNTER</option>
        <option value="9">Show div 9</option><option value="10">Show div 10</option>
        <option value="11">Show div 11</option><option value="12">Show div 12</option>
        <option value="13">Show div 13</option><option value="14">Show div 14</option>
        <option value="15">Show div 15</option><option value="16">Show div 16</option>
        <option value="17">Show div 17</option><option value="17">Show div 18</option>
        <option value="19">Show div 19</option><option value="18">Show div 20</option>
        <option value="21">Show div 21</option>
    </select>
</div>
<div id="di21"> <select name="" >
        <option value="">Select an option</option>
        <option value="4">Show div 4</option>
        <option value="5">Show div 5</option>
        <option value="6">Show div 6</option>
    </select>This </div>
        ..... so on

//这一次又一次地问我要添加一些上下文来解释代码。.我不知道该怎么办？
//每当我在第一个选择框中更改选项时，上面的JavaScript函数就会打开一个新的选择框。

Answer 1

这是Fidle

我简化了html只是为了测试，在SetSel(elem)函数中，您可以随时编写自定义代码以根据逻辑选择第二个组合值