javascript - 如何在javascript中自动选择下拉列表中的项目

Question

我有两个包含不同项目的下拉列表。如果我在 dropdownlist1 中选择一个项目，则该选定项目应该添加到 dropdownlist2 中并且应该被选中。使用下面的 javascript 代码，我可以在 dropdownlist2 中添加该项目，但它没有被选中。请让我知道如何自动选择新添加的项目。

var domName = document.getElementById("dropdownlist1");
var domSelectedText = domName.options[domName.selectedIndex].text;
var domSelectedValue = domName.options[domName.selectedIndex].value;
var opt = document.createElement("option");
opt.text = domSelectedText;
opt.value = domSelectedValue;
document.getElementById("dropdownlist2").options.add(opt);

Answer 1

我认为您只需要多一行就可以将新添加的项目标记为选中。

opt.selected = true;

Answer 2

您可以将代码缩减为：

var domName = document.getElementById("dropdownlist1"),
selectedOption = domName.options[domName.selectedIndex].cloneNode(true);

document.getElementById("dropdownlist2").appendChild(selectedOption);

演示

Answer 3

你让生活变得比它需要的更困难。考虑克隆节点而不是复制它：

var domName = document.getElementById("dropdownlist1");

if (domName.selectedIndex >= 0) {
  var opt = domName.options[domName.selectedIndex].cloneNode(true);
  opt.selected = true;
  document.getElementById("dropdownlist2").appendChild(opt);
}

Answer 4

尝试

var opt = new Option(domSelectedText, domSelectedValue)
Array.prototype.push.call(document.getElementById("dropdownlist2").options, opt)

Answer 5

var domName = document.getElementById("dropdownlist1");
var domSelectedText = domName.options[domName.selectedIndex].text;
var domSelectedValue = domName.options[domName.selectedIndex].value;
var sel2 = document.getElementById("dropdownlist2");
sel2.options[sel2.options.length]=new Option(domSelectedText,domSelectedValue)
sel2.selectedIndex = sel2.options.length-1;