使用嵌套的json结果绑定DropdownList

{
  "选项1": ["子选项1", "子选项2", "子选项3"],
  "选项2": ["子选项4", "子选项5"],
  "选项3": ["子选项6", "子选项7", "子选项8"],
  ...
}

// 假设已经有一个名为dropdownList的下拉列表控件
var dropdownList = document.getElementById("dropdownList");

// 假设已经有一个名为nestedJson的嵌套JSON数据结构
var nestedJson = {
  "选项1": ["子选项1", "子选项2", "子选项3"],
  "选项2": ["子选项4", "子选项5"],
  "选项3": ["子选项6", "子选项7", "子选项8"],
  ...
};

// 遍历嵌套JSON数据结构，将每个选项添加到下拉列表中
for (var option in nestedJson) {
  var optionElement = document.createElement("option");
  optionElement.value = option;
  optionElement.text = option;
  dropdownList.appendChild(optionElement);
}

// 监听下拉列表的change事件，根据选中的选项更新子选项
dropdownList.addEventListener("change", function() {
  var selectedOption = dropdownList.value;
  var subOptions = nestedJson[selectedOption];

  // 清空子选项
  while (dropdownList.options.length > 1) {
    dropdownList.remove(1);
  }

  // 添加子选项
  for (var i = 0; i < subOptions.length; i++) {
    var subOptionElement = document.createElement("option");
    subOptionElement.value = subOptions[i];
    subOptionElement.text = subOptions[i];
    dropdownList.appendChild(subOptionElement);
  }
});