如何使用 jQuery 向 DropDownList 添加选项？

问题描述

无需使用任何额外的插件，

var myOptions = {
    val1 : 'text1',
    val2 : 'text2'
};
var mySelect = $('#mySelect');
$.each(myOptions, function(val, text) {
    mySelect.append(
        $('<option></option>').val(val).html(text)
    );
});

如果您有很多选项，或者此代码需要非常频繁地运行，那么您应该考虑使用DocumentFragment而不是多次不必要地修改 DOM。对于少数几个选项，我会说这不值得。

- - - - - - - - - - - - - - - - 添加 - - - - - - - - - --------------

DocumentFragment是提高速度的好选择，但我们不能使用创建选项元素，document.createElement('option')因为 IE6 和 IE7 不支持它。

我们可以做的是，创建一个新的选择元素，然后附加所有选项。循环完成后，将其附加到实际的 DOM 对象。

var myOptions = {
    val1 : 'text1',
    val2 : 'text2'
};
var _select = $('<select>');
$.each(myOptions, function(val, text) {
    _select.append(
            $('<option></option>').val(val).html(text)
        );
});
$('#mySelect').append(_select.html());

这样我们只修改一次 DOM！

解决方法

正如问题所说，如何使用 jQuery 向 DropDownList 添加新选项？

谢谢