使用多数组 json 文件循环遍历 jquery .each 时出现问题

Question

我四处搜寻，却没有找到这个问题的答案。

我有一个 json 文件，我正在使用 .each 。看一下 .json 格式 - 它有几个子数组：

http://heykoolaid.com/sections2.json

这是 .html

http://heykoolaid.com/json_output.html

你可以看，它只是在数组中写入“[object Object]”。

我做错了什么？

我如何访问子数组？

到目前为止，我已经基本了解了这个问题，但在访问子数组数据时我仍然迷失了

这里是代码：(json)

{ "zones":[ {   "id":"arcade",  "zoneColor":"#ed08ef",  "sections":[        {           "sectionId":"arcade-145",           "name":"Arcade 145",            "coords":[[-32.36140331527542,43.2861328125],[-31.98944183792288,46.34033203125],[-29.80251790576445,46.5380859375],[-30.259067203213018,42.86865234375]],          "markers":[]        },      {           "sectionId":"arcade-146",           "name":"Arcade 146",            "coords":[[-30.977609093348676,37.08984375],[-33.06392419812064,37.177734375],[-32.41706632846281,42.6708984375],[-30.334953881988564,42.29736328125]],             "markers":[]        },      {           "sectionId":"arcade-147",               "name":"Arcade 147",            "coords":[[-31.034108344903498,36.40869140625],[-33.174341551002065,36.58447265625],[-33.5230788089042,33.8818359375],[-33.9433599465788,33.59619140625],[-33.26624989076273,33.15673828125],[-31.203404950917385,34.7607421875]],          "markers":[]        }   ] }, {  "id":"view-infield",    "zoneColor":"#0a1966",  "sections":[        {           "sectionId":"view-infield-305",                 "name":"View Infield 305",          "coords":[[-40.83043687764923,-40.0341796875],[-44.245199015221274,-36.18896484375],[-40.39676430557204,-29.6630859375],[-36.66841891894784,-33.37646484375]],          "markers":[]        },      {           "sectionId":"view-infield-307",                 "name":"View Infield 307",          "coords":[[-36.52729481454623,-44.560546875],[-40.17887331434696,-40.71533203125],[-36.42128244364948,-34.69482421875],[-32.56533316084102,-38.51806640625]],           "markers":[]        },      {           "sectionId":"view-infield-308",             "name":"View Infield 308",          "coords":[[-31.933516761903675,-49.02099609375],[-27.839076094777802,-43.06640625],[-32.082574559545904,-38.9794921875],[-35.97800618085566,-45.0439453125]],           "markers":[]        }   ] }, {  "id":"view-outfield",   "zoneColor":"#165604",  "sections":[        {           "sectionId":"view-outfield-333",                "name":"View Outfield 333",             "coords":[[60.45721779774397,36.6943359375],[56.58369172128337,47.373046875],[52.5897007687178,42.890625],[55.5161921571789,35.2001953125]],            "markers":[]        },      {           "sectionId":"view-outfield-334",                "name":"View Outfield 334",         "coords":[[56.353077613860826,48.0322265625],[52.656393941988,57.216796875],[52.03897658307622,57.7880859375],[49.48240137826932,50.4052734375],[52.32191088594773,43.52783203125]],            "markers":[]        },      {           "sectionId":"view-outfield-335",                "name":"View Outfield 335",             "coords":[[51.60437164681676,58.16162109375],[47.010225655683485,61.962890625],[44.276671273775186,54.7119140625],[49.081062364320736,50.82275390625]],             "markers":[]        },   {      "sectionId":"view-outfield-336",            "name":"View Outfield 336",         "coords":[[46.52863469527167,62.33642578125],[43.8186748554532,64.423828125],[40.94671366508002,57.216796875],[43.75522505306928,55.107421875]],        "markers":[]        }   ] }     ]   }

和 html：

<script type="text/javascript"> 
$(function() {
    $.getJSON("sections2.json", tickets);

    function tickets(data) {
        var htmlString = "";

        $.each(data.zones, function(index, value) {
            htmlString += item.sections + "<br/>";
        });

        $('#test').html(htmlString);

    }
});

Answer 1

如果您确切地知道从数据结构中需要什么，那么您可以通过结构下降，例如。

data.zones[i].sections[j].name  // Access known location in data structure

如果您需要迭代，那么 jQuery 的each() 函数非常方便：

$.each(data, function (i, zone) {
    //do stuff with zone data eg. print zone.id

    $.each(zone.sections, function (j, section) {
        //do stuff with section data, eg. print section.name
    });
});

或者仅使用 JavaScript 进行迭代：

for (i in data.zones) {
    zone = data.zones[i];
    // print zone.id
    for (j in zone.sections) {
        section = zone.sections[j];
        // print section data
    }
}

Answer 2

您可以使用

$.each({arr},function(index, value){
       alert(index + ': ' + value); 

     }
    );

$.each() 函数来迭代任何集合，无论它是映射（JavaScript 对象）还是数组

Answer 3

请参考getJSON的使用
http://api.jquery.com/jQuery.getJSON/

我不认为你将数据传递给成功处理程序。如果您按照上面链接中的示例进行操作，那么您的方向应该是正确的。

成功处理程序示例：

$.getJSON('ajax/test.json', function(data) {
  $('.result').html('<p>' + data.foo + '</p>'
    + '<p>' + data.baz[1] + '</p>');
});

您的 Ticket(data) 函数在 getJSON 完成后未获取数据。