Chrome浏览器：向选择框添加选项不会显示在下拉列表中

Question

当用户点击选择框时，甚至会发生Ajax。

此事件将选项放入选择框。

将选项放入选择框后，用户应该可以单击它们。

在Chrome中，当您点击下拉列表时出现“选择一个”，但在添加选项后，列表仍然是“选择一个”，用户可以点击向下箭头键并选择它，但它没有显示添加后，在“选项下拉列表”中。

什么神奇的JS或jQuery会刷新这个下拉列表，而不会在Chrome中再次点击？

单击该选项时，这将通过JS执行：

secBox = document.getElementById('sel34541_75');
secBox.length = 1;
addOption(secBox, "Option 1", "execPopDrop('sel34541_75', 34541, 'Option 1', 'type1', 'page.php')");
addOption(secBox, "Option 2", "execPopDrop('sel34541_75', 34541, 'Option 2', 'type2', 'page.php')");
addOption(secBox, "Option 3", "execPopDrop('sel34541_75', 34541, 'Option 3', 'type3', 'page.php')");
addOption(secBox, "Option 4", "execPopDrop('sel34541_75', 34541, 'Option 4', 'type4', 'page.php')");

添加选项功能如下所示：

function addOption(selectbox, text, value) {
  selectbox.options[selectbox.options.length]=new Option(text,value);
}

如果我点击然后点击向下箭头，我会看到动态选项，但不在列表中可见。 （这也适用于IE和FF）

如果我再次点击它，我会在下拉列表中看到正确的选项

Answer 1

试试这个 - 适用于所有浏览器 - 如果你需要支持IE4，那么你需要在添加选项之前在options.length中添加1;）

更新此解决方案是原始问题

function addOption(selectbox, text, value) {
  selectbox.options[selectbox.options.length]=new Option(text,value);
}

然而，为什么要在选项中添加可怕的字符串？

看起来你会（颤抖）EVAL值

中的字符串

为什么不

addOption(secBox, "Option 1", "sel34541_75");

然后在execPopDrop中传递select，那么它将是

function execPopDrop(sel) {
  var val = sel[sel.selectedIndex].value;
  var txt = sel[sel.selectedIndex].text;
  var type="type"+val.split(" ")[1]; // from Option 1
  var parm2 = val.replace(/[sel_]/g,""); // 34541
  // here you have all the stuff you need to do whatever you did before
}