Javascript 两个下拉列表,具有相互限制的不相同选项

Javascript 两个下拉列表,具有相互限制的不相同选项,javascript,jquery,Javascript,Jquery,我有两个下拉列表,选项不相同,但选项数相同。使用javascript(和jQuery1.11.1),我需要一个下拉列表来限制(通过禁用,而不是隐藏)另一个下拉列表中的可用选项到下一个选项和下面的选项 即: 选项1_1** 选项1_2** 选项1\u 3**已禁用** 选项1\u 4**已禁用** 选项1\u 5**已禁用** 选项2\u 1**已禁用** 选项2\u 2**已禁用** 选择2_3** 选择2_4** 选择2_5** 如果选择了dropdown1中的选项2,则dropdown2

我有两个下拉列表,选项不相同,但选项数相同。使用javascript(和jQuery1.11.1),我需要一个下拉列表来限制(通过禁用,而不是隐藏)另一个下拉列表中的可用选项到下一个选项和下面的选项

即:


选项1_1**
选项1_2**
选项1\u 3**已禁用**
选项1\u 4**已禁用**
选项1\u 5**已禁用**
选项2\u 1**已禁用**
选项2\u 2**已禁用**
选择2_3**
选择2_4**
选择2_5**
如果选择了dropdown1中的选项2,则dropdown2的选项1和2将被禁用,dropdown2中只有剩余的选项可用,dropdown1中未使用的选项也将被禁用。如果在Dropdown2中进行初始选择,Dropdown2将以相同的方式控制dropdown1


任何帮助都将不胜感激。

您可以通过使用
禁用
属性来实现此要求

这是你的电话号码

希望这能解决你的问题


-帮助:)

请写下您到目前为止尝试过的内容。抱歉,我没有说明在撰写本文时我没有尝试过任何东西,因为我一直在思考如何开始(我是新手)。但是,我刚刚发现这个问题[链接]的答案与我想要的答案相同,除了在一个列表中选择一个选项后,另一个列表中剩余的第一个选项是等效选项。我需要禁用等效选项,之后的下一个选项作为可用选项的开始。谢谢@Shriya R。虽然我确实需要dropdown2来控制dropdown1,但我修改了你的代码,通过复制更改函数和交换下拉名称,将控件从dropdown2包含到dropdown1,这似乎有效。没有请注意,您希望在dropdown2中进行的更改:)。你明白了吗?
<select id="dropdown1">
    <option value="0">option1_1</option> **
    <option value="0">option1_2</option> **
    <option value="1">option1_3</option> **DISABLED**
    <option value="2">option1_4</option> **DISABLED**
    <option value="3">option1_5</option> **DISABLED**
</select>

<select id="dropdown2">
    <option value="0">option2_1</option> **DISABLED**
    <option value="0">option2_2</option> **DISABLED**
    <option value="0">option2_3</option> **
    <option value="1">option2_4</option> **
    <option value="2">option2_5</option> **
</select>
$("select#dropdown1 option[value*='1'],select#dropdown1 option[value*='2'],select#dropdown1 option[value*='3'],select#dropdown2 option[value*='0']").prop('disabled',true);
 $(document).ready(function () {
        var index;
        $('#dropdown1').change(function ()
            {
            $('#dropdown2 option').removeAttr('disabled');
            index = $(this).find('option:selected').index() + 1;
            $('#dropdown2').find("option:lt(" + index + ")").prop("disabled", true);

            $('#dropdown1').find("option:gt(" + $(this).find('option:selected').index() + ")").prop("disabled", true);
            index = index -1;
            $('#dropdown1').find("option:lt(" + index + ")").prop("disabled", true);
            });
    });