如何创建在特定下拉列表中选择某个值时出现的下拉列表？

在前端开发中，可以通过以下步骤来创建在特定下拉列表中选择某个值时出现的下拉列表：

首先，需要创建一个 HTML 表单，并在表单中添加一个下拉列表（select）元素和一个目标下拉列表（target select）元素。

<form>
  <label for="mainSelect">主要下拉列表：</label>
  <select id="mainSelect" onchange="showTargetSelect()">
    <option value="">请选择</option>
    <option value="option1">选项1</option>
    <option value="option2">选项2</option>
    <option value="option3">选项3</option>
  </select>

  <label for="targetSelect">目标下拉列表：</label>
  <select id="targetSelect">
    <option value="">请选择</option>
  </select>
</form>

接下来，需要编写 JavaScript 函数 showTargetSelect()，该函数会在主要下拉列表的值发生变化时触发。

function showTargetSelect() {
  // 获取主要下拉列表的值
  var mainSelectValue = document.getElementById("mainSelect").value;

  // 获取目标下拉列表元素
  var targetSelect = document.getElementById("targetSelect");

  // 清空目标下拉列表的选项
  targetSelect.innerHTML = "";

  // 根据主要下拉列表的值，动态生成目标下拉列表的选项
  if (mainSelectValue === "option1") {
    targetSelect.innerHTML += "<option value='targetOption1'>目标选项1</option>";
    targetSelect.innerHTML += "<option value='targetOption2'>目标选项2</option>";
  } else if (mainSelectValue === "option2") {
    targetSelect.innerHTML += "<option value='targetOption3'>目标选项3</option>";
    targetSelect.innerHTML += "<option value='targetOption4'>目标选项4</option>";
  } else if (mainSelectValue === "option3") {
    targetSelect.innerHTML += "<option value='targetOption5'>目标选项5</option>";
    targetSelect.innerHTML += "<option value='targetOption6'>目标选项6</option>";
  }
}