可以在这里找到jQuery插件：使用jQuery和AJAX自动填充选择框。

if (data.length != 0) {
    var opts = "";
    for (i in data)
        opts += "<option value='"+data[i][value]+"'>"+data[i][text]+"</option>";

    $("#myselect").empty().append(opts);
}

在首先构建一个巨大的字符串之后，这仅操作一次DOM。

尽管先前的答案都是有效答案-建议您首先将所有这些附加到documentFragmnet，然后在...之后将该文档片段作为元素附加...

看看约翰·雷西格对此事的想法 ...

类似于以下内容：

var frag = document.createDocumentFragment();

for(item in data.Events)
{
    var option = document.createElement("option");

    option.setAttribute("value", data.Events[item].Key);
    option.innerText = data.Events[item].Value;

    frag.appendChild(option);
}
eventDrop.empty();
eventDrop.append(frag);

目前正在提议一种使用Microsoft模板化方法的方法，以将其包含在jQuery核心中。使用模板的功能更多，因此对于最简单的情况，它可能不是最佳选择。有关更多详细信息，请参见Scott Gu的文章概述了这些功能。

首先包括可从github获得的模板js文件。

<script src="Scripts/jquery.tmpl.js" type="text/javascript" />

下一步设置模板

<script id="templateOptionItem" type="text/html">
    <option value=\'{{= Value}}\'>{{= Text}}</option>
</script>

然后使用您的数据调用.render（）方法

var someData = [
    { Text: "one", Value: "1" },
    { Text: "two", Value: "2" },
    { Text: "three", Value: "3"}];

$("#templateOptionItem").render(someData).appendTo("#mySelect");

我在博客中更详细地这种做法。

完善@joshperry的答案：

似乎纯.append也可以按预期工作，

$("#mySelect").append(
  $.map(selectValues, function(v,k){

    return $("<option>").val(k).text(v);
  })
);

或更短

$("#mySelect").append(
  $.map(selectValues, (v,k) => $("<option>").val(k).text(v))
  // $.map(selectValues, (v,k) => new Option(v, k)) // using plain JS
);

jQuery的

var list = $("#selectList");
$.each(items, function(index, item) {
  list.append(new Option(item.text, item.value));
});

香草JavaScript

var list = document.getElementById("selectList");
for(var i in items) {
  list.add(new Option(items[i].text, items[i].value));
}