仅使用AJAX Jquery从数组填充依赖下拉列表

<select id="firstDropdown"></select>
<select id="secondDropdown"></select>

// 定义一个包含选项值的数组
var firstOptions = ["选项1", "选项2", "选项3"];

// 当页面加载完成时执行以下代码
$(document).ready(function() {
  // 填充第一个下拉列表
  fillDropdown("#firstDropdown", firstOptions);
  
  // 当第一个下拉列表的选中值发生变化时，填充第二个下拉列表
  $("#firstDropdown").change(function() {
    var selectedValue = $(this).val();
    var secondOptions = getSecondOptions(selectedValue);
    fillDropdown("#secondDropdown", secondOptions);
  });
});

// 填充下拉列表的函数
function fillDropdown(dropdownId, options) {
  var dropdown = $(dropdownId);
  dropdown.empty(); // 清空下拉列表的选项
  
  // 遍历数组，为下拉列表添加选项
  $.each(options, function(index, value) {
    dropdown.append($("<option></option>").text(value));
  });
}

// 根据第一个下拉列表的选中值获取第二个下拉列表的选项值的函数
function getSecondOptions(selectedValue) {
  // 根据选中值返回相应的选项值数组
  if (selectedValue === "选项1") {
    return ["选项1-1", "选项1-2", "选项1-3"];
  } else if (selectedValue === "选项2") {
    return ["选项2-1", "选项2-2", "选项2-3"];
  } else if (selectedValue === "选项3") {
    return ["选项3-1", "选项3-2", "选项3-3"];
  } else {
    return [];
  }
}