带有条件数据 JS 的下拉列表

Drop-Down Lists with Conditional Data JS

我有一个网站,我想包含 2 个下拉框。第二个下拉框中的值取决于第一个。

例如,如果选择下拉列表 1 中的选项 A,则下拉框 2 中的可用选项将为 1,2,3

如果选择选项 2,则下拉框 2 将显示 5、6、7。

我试过使用 JavaScript 接收第一个框的结果作为参数,然后使用 'if statement' 到 select drop 应该使用什么样的答案数组方框 2 然而这没有用

''' 我没有任何合理的代码可以显示'''

根据我的尝试,我可以收到第一个下拉框选项的索引,但是我无法让第二个框显示该选项的数组

<html>
<body>
<script type="text/javascript" src="jquery.min.js"></script>
<select id="ddl1">
<option selected value="1">A</option>
<option value="2">B</option>
</select>
<select id="ddl2">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</body>

<script>
$("#ddl1").change(function(){
$('#ddl2 option').remove();
if($("#ddl1 option:selected").val()==1){
    $('#ddl2').append('<option value="1">1</option>');
    $('#ddl2').append('<option value="2">2</option>');
    $('#ddl2').append('<option value="3">3</option>');
    }
else if($("#ddl1 option:selected").val()==2){
    $('#ddl2').append('<option value="5">5</option>');
    $('#ddl2').append('<option value="6">6</option>');
    $('#ddl2').append('<option value="7">7</option>');
    }
});
</script>
</html>