0

JSON があり、この JSON を取得して ul li リストとして html に入れる必要があります。値をobjectとして取得し、[object Object]をhtmlで表示します。jsonを変更すると動作します。そのため、スクリプトに問題があり、json ファイルを適切にループできない可能性があります。誰か助けてください：

私のJSONは：

[
    {
        "us":"USA"  
    },
    {
        "fr":"FRANCE"
    },
    {
        "es":"Spain"
    },
    {
        "sa":"South Africa"
    }
]

そしてJSは

<script>
  $.getJSON('jsonfile', function(data) {
    var items = [];
    $.each(data ,function(key,val) {
      items.push('<li id="'+ key +'">' + val +'</li>');
    });
    $('<ul />' , {
      'class':'new-div',
      html:items.join('')
    }).appendTo('body');
  });
</script>

更新された JSON:

[
{
    "items":
        {
            "item":
                [
                    {
                        "id": "0001",
                        "type": "donut",
                        "name": "Cake",
                        "ppu": 0.55,
                        "batters":
                            {
                                "batter":
                                    [
                                        { "id": "1001", "type": "Regular" },
                                        { "id": "1002", "type": "Chocolate" },
                                        { "id": "1003", "type": "Blueberry" },
                                        { "id": "1004", "type": "Devil's Food" }
                                    ]
                            },
                        "topping":
                            [
                                { "id": "5001", "type": "None" },
                                { "id": "5002", "type": "Glazed" },
                                { "id": "5005", "type": "Sugar" },
                                { "id": "5007", "type": "Powdered Sugar" },
                                { "id": "5006", "type": "Chocolate with Sprinkles" },
                                { "id": "5003", "type": "Chocolate" },
                                { "id": "5004", "type": "Maple" }
                            ]
                    }


                ]
        }
}
]
4

1 に答える 1

3

ループしているのdataは、オブジェクトを持つ配列です。したがって、あなたkeyは0、、1などになり、配列内のその位置にあるオブジェクトvalになります。

各オブジェクトには 1 つのプロパティしかありませんが、プロパティ名はオブジェクトごとに異なるため、JSON 構造は実際には出力が少し面倒です。オブジェクトのプロパティが 1 つしかない場合でも、オブジェクトのプロパティをループすることで、それを行うことができます。

var items = [];
$.each(data ,function(outerKey, outerVal) { // <== Loops through the array
  $.each(outerVal, function(key, val) {     // <== "Loops" through each object's properties
      items.push('<li id="'+ key +'">' + val +'</li>');
  });
});

...しかし、代わりに JSON 構造を変更します。たとえば、キーが一意であると仮定すると、元のコードは次の構造で機能します。

{
    "us":"USA",
    "fr":"FRANCE",
    "es":"Spain",
    "sa":"South Africa"
}
于 2012-11-24T09:09:23.047 に答える