为什么IE不添加<选项>到我的下拉菜单？

Question

我正在使用 IE 运行这个示例脚本：

var $select = $('#select');
var $button = $('#button');

$button.click(function() {
    var $option = $('<option />');
    $option.text('hello');
    $option.appendTo($select);
});

var $tabs = $('#tabs');
$tabs.tabs();

它非常简单：当单击按钮时，应该将选项添加到我的下拉列表中。这非常有效——IE 中的基本功能。

我的问题：
只需“打开”下拉菜单，然后再次“关闭”它。现在切换到“按钮”选项卡并点击按钮。现在切换到“选择”选项卡 - 应该会出现一个新的选项。
这在除 IE 之外的所有浏览器上都非常有效...（有时 IE 在几次选项卡切换后会出现混乱）

我该如何修复我的脚本？

Answer 1

与添加 option DOM 元素 (实例)：

$button.click(function() {
    var option = new Option('hello');
    $select[0].options.add(option);
});

也许这对你来说更可靠。 （请注意，它是 add，不是 push。select 元素上的 options 对象并不是真正的数组。）

除了 options.add 之外，您还可以执行以下操作：

$button.click(function() {
    var options = $select[0].options,
        option  = new Option('hello');
    options[options.length] = option;
});

...这也会以类似数组的方式添加到末尾。但 add 是可靠的跨浏览器。