除了选中

Question

在下拉列表中选择一个值后，我想在此下添加新的下拉列表，除了选中的值之外的所有值。对于第三个，第四个，相同的方式.....对于第三个下拉值，除了选定值之外，将全部来自第二个下拉值。所有下一步都是这样的。

在javaScript中执行此操作的方法是什么？

HTML元素......

<select id="president" name="president" type="text">
    <option value="0">Select President</option>
    <option value="1">Name A</option>
    <option value="2">Name B</option>
    <option value="3">Name C</option>
    <option value="4">Name D</option>
    <option value="5">Name E</option>
    <option value="6">Name F</option>
    <option value="7">Name G</option>
    <option value="8">Name H</option>
    <option value="9">Name I</option>
</select>
<select id="vicepresident" name="vicepresident" type="text">
    <option value="0">Select Vice President</option>
</select>

Answer 1

将所有选项放入数组中，将其传递给总统＆＃39;，然后获取所选索引，并将除此之外的所有值附加到副总裁阵列中。

Answer 2

得到了我的结果.........

<select class="slctfield" id="president" name="president" type="text">
    <option value="0">Select President</option>
    <option value="1">Name A</option>
    <option value="2">Name B</option>
    <option value="3">Name C</option>
    <option value="4">Name D</option>
    <option value="5">Name E</option>
    <option value="6">Name F</option>
    <option value="7">Name G</option>
    <option value="8">Name H</option>
    <option value="9">Name I</option>
</select>
<select class="slctfield" id="vicepresident" name="vicepresident" type="text"></select>

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript"> 
    $('.slctfield').on('click', function() {
        var i = $('.slctfield').index(this);
        var j = i+1;
        var $options = $(this).find('option');
        var $tempDiv = $('<div/>');
        $options = $options.each(function (idx, option) {
        if (!$(option).prop('selected')) {
            $tempDiv.append($(option).clone());
        }
    });
    $('.slctfield:eq('+j+')').show();
    $('.slctfield:eq('+j+')').html($tempDiv.html());
    });
</script>

在这里你可以添加更多选择字段＆＃39; slctfield＆＃39;类。