jquery 改变选择下拉值

Question

我正在尝试通过从下拉菜单中选择某个选项来使用 jqquery 更改下拉选择菜单。

示例:

<select name="options">
    <option value='3'>Option 3</option>
    <option value='5'>Option 4</option>
    <option value='7'>Option 5</option>
</select>

另一个下拉菜单:

<select name="rounds">
    <option value='1'>1</option>
    <option value='3'>3</option>
    <option value='5'>5</option>
    <option value='7'>7</option>
</select>

假设有人选择选项 4，那么另一个下拉列表将动态更改其值:

<select class='button' name="rounds">
    <option value='23'>23</option>
    <option value='5'>5</option>
    <option value='12'>12</option>
</select>

每个选项都会改变回合菜单，用户可以在选项之间切换。无论如何要这样做吗？有在线演示吗？

Answer 1

当您需要删除所有 otpin 时进行更改，如下所示

$("[name='options']").change(function() 
    { 
        val = $(this).val(); 
        $("[name='rounds'] >option").remove();

比在 if 条件下根据需要逐一添加项目

var opt ;
if(val == 4)
{
  opt = {
        val1 : 'text1',
        val2 : 'text2'
    };
}
if(val ==1 )
{
          opt = {
        val1 : 'text3',
        val2 : 'text4'
    };
}
    $.each(opt, function(val, text) {
        $("[name='rounds']").append(
            $('<option></option>').val(val).html(text)
        );
    });

  }); 
});