动态下拉在 IE11 中不起作用？

Question

var vehicleLineDD = document.getElementById("vehicleLineDD");
for (i = 0; i < arr.length; i++) {
    vehicleLineOp.text = arr[i].code + ': ' + arr[i].desc;
    vehicleLineOp.value = arr[i].code;
    vehicleLineDD.add(vehicleLineOp, null);
}

嗨朋友们，我在这里附上我现在敲击的代码。 问题是 vehicleLineDD 是动态下拉。取决于另一个下拉列表，我应该在此处加载值。 它在 IE8 中运行良好，但在 IE11 中，所有值都正常出现，除了 vehicleLineDD.add(vehicleLineOp, null); 不添加值，仅添加最后一个值。每次在这里更改第一个下拉菜单时，我只能看到一个选项。 谁能帮我解决这个问题。提前致谢。

Answer 1

您需要为 vehicleLineOp 变量创建一个新的选项元素（使用类似于vehicleLineOp = document.createElement("option"); 的代码），否则您只是不断更新具有不同文本和值属性的相同选项元素（这就是为什么只应用最后一个文本和值正在显示）。

var vehicleLineOp;
var vehicleLineDD = document.getElementById("vehicleLineDD");
for (i = 0; i < arr.length; i++) {
    vehicleLineOp = document.createElement("option");
    vehicleLineOp.text = arr[i].code + ': ' + arr[i].desc;
    vehicleLineOp.value = arr[i].code;
    vehicleLineDD.add(vehicleLineOp);
}

编辑：这是一个可以在 IE11 和 IE8 中运行的示例：

function populate() {
  var arr = document.getElementById("input").value.split("\n");
  var vehicleLineOp;
  var vehicleLineDD = document.getElementById("vehicleLineDD");
  vehicleLineDD.innerHTML = "";
  for (var i = 0; i < arr.length; i++) {
    vehicleLineOp = document.createElement("option");
    vehicleLineOp.text = arr[i];
    vehicleLineOp.value = arr[i];
    vehicleLineDD.add(vehicleLineOp);
  }
}
var btn = document.getElementById("btnPopulate");
if (btn.addEventListener) {
  btn.addEventListener("click", populate);
} else {
  btn.attachEvent("onclick", populate);
}

Add each choice as a new line in the text area below, thn click "Populate Dropdown":<br/>
<textarea id="input" style="vertical-align:top;height:4em;">Example 1
Example 2
Example 3</textarea>
<input type="button" value="Populate Dropdown" id="btnPopulate" />
<br/>
<select id="vehicleLineDD"></select>