javascript - 使用 JQuery 将此特定数组附加到 html select

Question

我有以下脚本:

$(function () {
    var selectValues = new Array();
    selectValues = [{"Selected":false,"Text":"Apple","Value":"1"},{"Selected":false,"Text":"Samsung","Value":"2"},{"Selected":false,"Text":"LG","Value":"3"}];
    $.each(selectValues, function (key, value) {
        $('#brand-0')
             .append($('<option>', { value: key })
             .text(value))
             .prop("selectedIndex", -1);
    });
    });

但是当它运行时，它将每个列表对象显示为[object Object]。我错过了什么？

Answer 1

正如我上面提到的，您有一个对象数组，因此 .each() 循环中的每个 value 都是当前对象。您需要在新 option 元素中提取适合每个展示位置的数据。

$(function () {
    var selectValues = [{"Selected":false, "Text":"Apple",  "Value":"1"},
                        {"Selected":false, "Text":"Samsung","Value":"2"},
                        {"Selected":false, "Text":"LG",     "Value":"3"}];
    var brand = $('#brand-0');

    brand[0].selectedIndex = -1;

    $.each(selectValues, function (i, value) {
        $('<option>', { 
             value: value.Value,
             text: value.Text
        }).appendTo(brand);

        if (value.Selected) {
            brand[0].selectedIndex = i;
        }
    });
});

<小时/>

顺便说一句，您不需要在 selectedValues 对象中使用所有这些双引号。

var selectValues = [{Selected:false, Text:"Apple",  Value:"1"},
                    {Selected:false, Text:"Samsung",Value:"2"},
                    {Selected:false, Text:"LG",     Value:"3"}];