使用jQuery从JavaScript对象向＜select＞添加选项的最佳方法是什么？
我正在寻找一些不需要插件的东西，但我也会对现有的插件感兴趣。
这是我所做的：
selectValues = { "1": "test 1", "2": "test 2" };
for (key in selectValues) {
if (typeof (selectValues[key] == 'string') {
$('#mySelect').append('<option value="' + key + '">' + selectValues[key] + '</option>');
}
}
干净/简单的解决方案：
这是matdumsa的清理和简化版本：
$.each(selectValues, function(key, value) {
$('#mySelect')
.append($('<option>', { value : key })
.text(value));
});
matdumsa的更改：（1）删除了append（）内选项的close标记，（2）将财产/属性作为append）的第二个参数移动到映射中。
我做了类似的事情，通过Ajax加载一个下拉项。上面的响应也是可以接受的，但是为了更好的性能，尽可能少地修改DOM总是很好的。
因此，与其在循环中添加每个项目，不如在循环中收集项目，并在完成后将其追加。
$(data).each(function(){
... Collect items
})
附加它，
$('#select_id').append(items);
甚至更好
$('#select_id').html(items);
大多数其他答案使用each函数对selectValues进行迭代。这需要为每个元素调用append，并在单独添加每个元素时触发回流。
将此答案更新为更惯用的函数方法（使用现代JS）可以形成为只调用append一次，使用map和option元素构造函数创建一个option元素数组。
使用OptionDOM元素应该可以减少函数调用开销，因为在创建后不需要更新Option元素，也不需要运行jQuery的解析逻辑。
$('mySelect').append($.map(selectValues, (k, v) => new Option(k, v)))
如果您创建一个将新建选项对象的工厂实用程序函数，则可以进一步简化此过程：
const newoption = (...args) => new Option(...args)
然后，这可以直接提供给地图：
$('mySelect').append($.map(selectValues, newoption))
以前的公式
因为append还允许将值作为可变数量的参数传递，所以我们可以预先创建选项元素映射列表，并使用apply将它们作为参数附加到单个调用中。
$.fn.append.apply($('mySelect'), $.map(selectValues, (k, v) => $("<option/>").val(k).text(v)));
在jQuery的后续版本中，append也接受数组参数，这可以稍微简化：
$('mySelect').append($.map(selectValues, (k, v) => $("<option/>").val(k).text(v)))
$.each比for循环慢每次，DOM选择都不是循环$（“#mySelect”）.append（）中的最佳实践；
因此，最佳解决方案如下
如果JSON数据resp为
[
{"id":"0001", "name":"Mr. P"},
{"id":"0003", "name":"Mr. Q"},
{"id":"0054", "name":"Mr. R"},
{"id":"0061", "name":"Mr. S"}
]
将其用作
var option = "";
for (i=0; i<resp.length; i++) {
option += "<option value='" + resp[i].id + "'>" + resp[i].name + "</option>";
}
$('#mySelect').html(option);
JSON格式：
[{
"org_name": "Asset Management"
}, {
"org_name": "Debt Equity Foreign services"
}, {
"org_name": "Credit Services"
}]
以及jQuery代码，用于填充Ajax成功时下拉列表的值：
success: function(json) {
var options = [];
$('#org_category').html(''); // Set the Dropdown as Blank before new Data
options.push('<option>-- Select Category --</option>');
$.each(JSON.parse(json), function(i, item) {
options.push($('<option/>',
{
value: item.org_name, text: item.org_name
}));
});
$('#org_category').append(options); // Set the Values to Dropdown
}
