我经常看到的示例似乎不是最优的,因为它涉及到连接字符串,这似乎不是jQuery。它通常是这样的:

$.getJSON("/Admin/GetFolderList/", function(result) {
    for (var i = 0; i < result.length; i++) {
        options += '<option value="' + result[i].ImageFolderID + '">' + result[i].Name + '</option>';
    }
});

有没有更好的办法?


当前回答

我一直在使用jQuery和调用一个函数来填充下拉列表。

function loadDropDowns(name,value)
{
   var ddl = "#Categories";
   $(ddl).append('<option value="' + value + '">' + name + "</option>'");
}

其他回答

我读过使用文档片段是高性能的,因为它避免了每次插入DOM元素时页面回流,它也被所有浏览器(甚至ie6)很好地支持。

var fragment = document.createDocumentFragment(); 美元。Each (result, function() { 片段。列表末尾($(“<选项/ >”).val (this.ImageFolderID)。text (this.Name) [0]); }); $(" #选项”).append(片段);

我第一次读到这个是在CodeSchool的JavaScript最佳实践课程中。

这里是不同方法的比较,感谢作者。

我使用jquery插件的选择框。它把你的例子变成:

$('#idofselect').ajaxAddOption('/Admin/GetFolderList/', {}, false);

对于像我这样的JavaScript新手,更不用说JQuery了,JavaScript的方式是:

result.forEach(d=>$("#dropdown").append(new Option(d,d)))
function generateYears() {
                    $.ajax({
                        type: "GET",
                        url: "getYears.do",
                        data: "",
                        dataType: "json",
                        contentType: "application/json",
                        success: function(msg) {
                            populateYearsToSelectBox(msg);
                        }
                    });
}

function populateYearsToSelectBox(msg) {
  var options = $("#selectYear");
$.each(msg.dataCollecton, function(val, text) {
   options.append(
        $('<option></option>').val(text).html(text)
    );
});
}

我发现这是从jquery网站工作

$.getJSON( "/Admin/GetFolderList/", function( data ) {
  var options = $("#dropdownID");
  $.each( data, function(key, val) {
    options.append(new Option(key, val));
  });
});