如何在页面初始加载时基于第一列表框动态填充第二列表框？

Question

如果我有几个列表框，其中第一个列表框是通过json文件填充的，然后第二个列表框是根据在第一个列表框中选择的内容填充的，那么如何获取第二个列表框以进行加载？

第一个列表框会加载例如myfile.json的抓取文件，其中包含

    { [ { "snow project", "12345" }, { "rain project", "23245" } ]}

要生成一个列表框（例如，snow project作为键，并且val为12345），第二个列表框将获取myfile_12345.json来填充第二个框。 如果我选择rain项目，则它确实可以捕获数据并填充第二个列表框，但是我希望第二个列表框可以加载第一个选定项的数据，这可能会随着myfile.json文件内容的更改而改变。

Answer 1

创建列表框的相同代码允许我设置第二个。 我不确定添加更多内容后会变得多么容易或实用。

    <script type="text/javascript">
            var $select = $('#project');
            $.getJSON('bamboo_projects.json', function(data,status) {
                    $select.html('');
                    $.each(data, function(key,val) {
                            if ( val.id != 'undefined' && $('#project option:selected').length == 0) {
                                    getRelease(val.id);
                            }
                            $select.append('<option value="' + val.id + '">' + val.name + '</options>');
                    });
            });
    </script>

我在创建第一个框时检查了它何时要添加第一个选项，并运行用于获取第二个框内容的相同代码。

请注意，我确实尝试了var selected_item = val.id，但在$ .each和$ .getJSON代码完成后，selected_item超出了范围，因此我改用$ .each循环内的值。 关于如何保持价值范围的想法？ 我试图在$ .getJSON / $。each循环之外设置var selected_item，但仍然没有保留该值。