Question

是的，我对同一主题有3个或4个不同的答案，但我很难将它们结合起来创造我需要的东西。我使用Json.Net序列化我的结果，结果产生以下对象：

"[  { "Id": 1, "OrderInList": 1  },
    { "Id": 2, "OrderInList": 2  },
    { "Id": 4, "OrderInList": 3  }
]"

我希望选项值和文本为OrderInList值（稍后我将使用其他ID）。

我目前有以下代码，但它会创建 143 选项框。我可以看出为什么会这样做，但我不知道如何改变它以使其发挥作用。

    $.getJSON("/Json/GetOrderSelectList?parentCategoryId=" + postData, null, function (jsonResult) {
        $('#orderInList').attr('enabled', 'true');
        $.each(jsonResult, function() {
            $.each(this, function(index, item) {
                                $('#orderInList').append(
                                    $("<option></option>")
                                        .text(index)
                                        .val(index)
                                );

            });
        });

任何帮助将不胜感激！

Answer 1

我认为你正在尝试这样的事情：

var jsonResult = [{
    "Id": 1,
    "OrderInList": 1},
{
    "Id": 2,
    "OrderInList": 2},
{
    "Id": 4,
    "OrderInList": 3}
]

$('#orderInList').attr('enabled', 'true');
$.each(jsonResult, function() {
   $('#orderInList').append(
        $("<option></option>").text(this.Id).val(this.OrderInList);
   );
});

<强> DEMO

完整代码

$.getJSON("/Json/GetOrderSelectList?parentCategoryId=" + postData, function(jsonResult) {
    $('#orderInList').attr('enabled', 'true');
    $.each(jsonResult, function() {
        $('#orderInList').append(
            $("<option></option>").text(this.Id).val(this.OrderInList)
        );
    });
});

Answer 2

你不需要额外调用.each，它嵌套在第一次调用.each中。只需在第一个.each调用中传递项目和索引，然后创建元素。试试这个：

var json = [  { "Id": 1, "OrderInList": 1  },
    { "Id": 2, "OrderInList": 2  },
    { "Id": 4, "OrderInList": 3  }
];

function createSelect(options){
    $.each(options,function(index,item){
           $("#orderInList").append($("<option></option>").attr("value", item.OrderInList).text(item.OrderInList));

    });
}

$(document).ready(function(){
createSelect(json);
});

工作示例：http://jsfiddle.net/BzC9N/

如何使用JQuery从JSON对象创建此选择列表？

2 个答案: