Question

我是json数组/对象的新手。我试图在我的.json文件中找到一些子对象。我在这里尝试过这些建议，但我一直得到“未定义”的结果。这是.json -

{
  "DACcourses": [
    {
       "longTitle": "<a href='#'>Ammo-29 Electrical Explosives Safety for Naval Facilities</a>",
      "longDescript": "ammo-29.html",
      "atrrsLink": "Win 95+",
      "delMeth": "standard",
      "sked": [
        {
         "classNumb": "926",
          "startDate": "4/16/2012",
          "endDate": "4/20/2012",
          "location": "NMC Fort Worth, TX",
          "status": "scheduled",
          "emptySeats": "Availability"
        },
        {
          "classNumb": "001",
          "startDate": "6/4/2012",
          "endDate": "6/8/2012",
          "location": "McAlester, OK",
          "status": "scheduled",
          "emptySeats": "Availability"
        },
        {
          "classNumb": "920",
          "startDate": "6/18/2012",
          "endDate": "6/22/2012",
          "location": "Belle Chasse, LA",
          "status": "scheduled",
          "emptySeats": "Class Full"
        }
      ]}
]}

我必须做一些根本错误的事情。所以这是我的代码。最后，我试图从每个'sked'对象中构建表行。但是我遇到了在控制台中显示单个数据元素的问题。这是我的尝试：

$('#content').on("click", "#catList tbody tr", function() {
                    var aData = oTable.fnGetData( this );
                    console.log( aData );
                    var scheduleData = aData.sked;
                    var catLink = 'catalog/' + aData.longDescript;
                    $('#fullDescript').load(catLink, function() {
                        if (!$('#fullDescript #offerings')) {
                            $('.enrollBTN').hide();
                        };

                        if ($(scheduleData).length > 0) {
                            $(scheduleData).each(function() {
                                for(var i = 0; i < scheduleData.length; i++) {
                                    /*var startDate = aData.sked.startDate[2];
                                    var endDate = aData.sked.endDate[3];
                                    var location = aData.sked.location[4];
                                    var classNumb = aData.sked.classNumb[1];
                                    var status = aData.sked.status[5];
                                    var emptySeats = aData.sked.emptySeats[6];*/
                                    //var item = scheduleData[i];
                                    console.log( aData.sked.startDate[2] );
                                    var html = "<tr>";
                                        html += "<td>" + item.classNumb + "<\/td>";
                                        //console.log( aData.sked[1].classNumb );
                                        /*html += "<td>" + scheduleData.endDate + "<\/td>";
                                        html += "<td>" + scheduleData.location + "<\/td>";
                                        html += "<td>" + scheduleData.classNumb + "<\/td>";
                                        html += "<td>" + scheduleData.status + "<\/td>";
                                        html += "<td>" + scheduleData.emptySeats + "<\/td>";*/
                                        html += "<\/tr>";
                                        //return scheduleData;
                                    };
                                $('#schedule tbody').append($(html));
                            });
                        };
                    });

                    $('#content').hide();
                    $('#fullDescript').show();
                });

感谢任何帮助。

Answer 1

您似乎只需要每个或用于循环，但不能同时使用两者。对于是否使用 item = scheduleData [i] ，看起来还有一些混淆。试试这个：

if ($(scheduleData).length > 0) {
    for(var i = 0; i < scheduleData.length; i++) {
        var item = scheduleData[i];
        var html = "<tr>";
        html += "<td>" + item.endDate + "</td>";
        // ... etc
        html += "</td>";
    }
}

就像PS一样，我建议你研究一下像Mustache.js这样的JS模板工具。这将允许您将数据与显示模板分开，因此您可以消除解析代码。它看起来像这样：

var template = "{{#sked}}<tr><td>{{endDate}}</td><td>{{location}}</td></tr>{{/sked}}";
var html = "<table>" + Mustache.render(template, aData) + "</table>";

Answer 2

我必须做一些根本错误的事情

是的，你是。

使用.each循环时，请按this关键字引用当前元素。所以你不需要for循环。或者，如果您想要for循环，则不需要.each循环。在我看来，使用for循环。在这种情况下，.each只是一个开销。

更新： @dbaseman完全满足您的需求：）

更新2 ：请尝试以下代码。基本上与dbaseman的相同，但dbaseman的片段错过了关闭<tr>元素。

if ($(scheduleData).length > 0) {
    for(var i = 0; i < scheduleData.length; i++) {
        var item = scheduleData[i];
        var html = "<tr>";
        html += "<td>" + item.endDate + "</td>";
        // ... etc
        html += "</tr>"; // should close the <tr> here
    }
}

循环通过json子对象并对每个“元素”做一些事情

2 个答案: