Jquery 以编程方式创建选择列表

有人知道使用JQuery以编程方式创建包含选项的HTML选择列表的技术吗？

这是非常简单的：

var s = $('<select/>');
var o = [1, 2, 3];
for (var i in o) {
    s.append($('<option/>').html(o[i]));
}
$('body').append(s);

var selectList = "<select name='numbers'>";
for (var x = 0; x < 10; x++) {
    selectList += "<option>" + x + "</option>";
}
selectList += "</select>";
$('#my-container').html(selectList);

---

我知道这很老了，但这是什么

$selectBox.html($.map(myArray, function(){
    return $('<option/>', {text: this});
}));

如果您已经在DOM中的某个地方列出了列表，请重用它，并从以前的用户交互中将其设为空

// Call existing list, chain empty()
var my_list = $("#my_list").empty();
                    
// Build list
$(my_arr).each(function() {
    my_list.append($("<option/>").attr(\'value\',this.item_id).text(this.item_name));
});

---

以下是一个变体-基于此线程中以前的答案-除了选择输入选项之外，其他所有选项都可以通过输入JSON对象指定：

如果能在JSON输入中以某种方式指定选项数组，您会很感兴趣吗

---

下面是这个问题的另一个版本的答案，它使用ajax获取json响应，用于创建带有键值对的选择列表

        $.ajax({
        type: 'post',
        url: 'include/parser.php',
        data: {                     
            mode: 'getSubtypes',
            type: type
        },
        success: function (response) {
            var mySubtype = document.getElementById("Component");
            var components = $.parseJSON(response);

            var selectList = document.createElement("select");
            selectList.id = "subtype";
            selectList.name = "subtype";
            mySubtype.appendChild(selectList);
            $('#subtype').append('<option value="">Select ...</option>');
            $.each(components, function(k, v) {
                var option = new Option(v, k); 
                $('#subtype').append($(option));               
            });
        }
    });        

---

我觉得比较简单

 arr.map(x => ($("YOUR SELECTOR").append(`<option value="${x}">${x}</option>`)));

---

函数式编程范式的伟大方法，我们都需要转向它！

        $.ajax({
        type: 'post',
        url: 'include/parser.php',
        data: {                     
            mode: 'getSubtypes',
            type: type
        },
        success: function (response) {
            var mySubtype = document.getElementById("Component");
            var components = $.parseJSON(response);

            var selectList = document.createElement("select");
            selectList.id = "subtype";
            selectList.name = "subtype";
            mySubtype.appendChild(selectList);
            $('#subtype').append('<option value="">Select ...</option>');
            $.each(components, function(k, v) {
                var option = new Option(v, k); 
                $('#subtype').append($(option));               
            });
        }
    });        

 arr.map(x => ($("YOUR SELECTOR").append(`<option value="${x}">${x}</option>`)));