Javascript-Json:如何访问下拉选项

我使用json来自动填充下拉列表。根据用户选择的内容，我希望自动填充另外两个字段。

示例:

1)。用户从下拉列表中选择Apple(从json中拉出)
2.)第二个下拉列表给出了不同苹果的选择(从相同的json文件中提取)

现在，我想从2.)中获取数据，并使用它自动填充另外两个字段

3)。Apple c. is [6 oz](我可以将其存储在json文件中吗?)
4.） Apple c. is[3.99$](我也可以将其存储在json文件中)

现在，我已经完成了第1步和第2步。

我不知道如何将2.)中的选择以一种与3.)和4.)相对应的方式自动绑定。

我的代码:data.json

    {
"apple": "a, b, c, d,",
"orange": "1,2,3,4,",
"banana": "a1, b2, c3, d4,"
   }

当前使用以下命令自动填充下拉菜单:

    <script>
    $(function() {
        $("#json-one").change(function() {
            var $dropdown = $(this);
            $.getJSON("jsondata/data.json", function(data) {
                var key = $dropdown.val();
                var vals = [];
                switch(key) {
                    case 'apple':
                        vals = data.apple.split(",");
                        break;
                    case 'orange':
                        vals = data.orange.split(",");
                        break;
                    case 'banana':
                        vals = data.banana.split(",");
                        break;
                    case 'base':
                        vals = ['Please choose from above'];
                }
                var $jsontwo = $("#json-two");
                $jsontwo.empty();
                $.each(vals, function(index, value) {
                    $jsontwo.append("<option>" + value + "</option>");
                });
            });
        });

    });
</script>

这一切都很好。

我似乎不知道如何获得用户选择的水果的值/类型。我想要得到这个值，根据这个值，我想要显示关于这种水果的信息。