表json數據返回未定義使用jQuery

Question

您好我難以理解爲什麼我的表中的數據返回undefined。我想我很接近。 請看看我的jsfiddle：

$(document).ready(function() { 
    $.getJSON("http://www.corsproxy.com/dvl.thomascooper.com/data/json_return.json", function(data) { 
     //static table head 
     $('table.stats').append("<th>" + "</th>" + "<th>" + "Date" + "</th>" + "<th>" + "Brand" + "</th>" + "<th>" + "Author" + "</th>" + "<th>" + "Title" + "</th>" + "<th>" + "Posts" + "</th>" + "<th>" + "Exposure" + "</th>" + "<th>" + "Engagement" + "</th>"); 
     //loop through json data 
     $.each(data.data.rows,function(i, val){ 
      //+1 to number each row starting at 1 
      var rowNum = i + 1; 
      //create table rows and cell and populate with data 
      $('table.stats').append( "<tr>" + "<td>" + rowNum + "</td>" + "<td>" + val.date + "</td>" +"<td>" + val.brand_id + "</td>" + "<td>" + val.author + "</td>" + "<td>" + val.title + "</td>" + "<td>" + val.posts + "</td>" + "<td>" + val.reach + "</td>" + "<td>" + val.interaction + "</td>" + "</tr>"); 

     }); 
    }); 
}); 

小提琴：http://jsfiddle.net/tommy6s/eLbq2wvh/

Answer 1

$.each(data.data.rows,function(i, val) { 

這裏，val都不會反對（你的數據告訴我）

，所以你可以不訪問屬性，這樣undefined：val.date

我認爲，這裏是你想要的東西：

$(document).ready(function() { 


$.getJSON("http://www.corsproxy.com/dvl.thomascooper.com/data/json_return.json", function(data) { 

    //static table head 
    $('table.stats').append("<th>" + "</th>" + "<th>" + "Date" + "</th>" + "<th>" + "Brand" + "</th>" + "<th>" + "Author" + "</th>" + "<th>" + "Title" + "</th>" + "<th>" + "Posts" + "</th>" + "<th>" + "Exposure" + "</th>" + "<th>" + "Engagement" + "</th>"); 
     //loop through json data 
     $.each(data.data.rows,function(i, val){ 
      //+1 to number each row starting at 1 
      var rowNum = i + 1; 
      //create table rows and cell and populate with data 
      $('table.stats').append( "<tr>" + "<td>" + rowNum + "</td>" + "<td>" + val[0].value + "</td>" +"<td>" + val[1].value + "</td>" + "<td>" + val[2] + "</td>" + "<td>" + val[3].label + "</td>" + "<td>" + val[4].values[0] + "</td>" + "<td>" + val[5].values[0] + "</td>" + "<td>" + val[6].values[0] + "</td>" + "</tr>"); 

     }); 
    }); 


}); 

Answer 2

如果你看看返回的JSON - 行是一個數組的數組不是對象的數組。你沒有考慮到這一點。

$.each(data.data.rows[0],function(i, val){ 

此外，您正試圖通過它的值而不是其密鑰訪問數據的值。

"<td>" + val.field + "</td>" +"<td>" + val.type + "</td>" 

結帳這個jsbin for example

Answer 3

您正在嘗試引用數據，好像它是： 行：[{日期和時間： ''，brand_id： ''，作者： '' 等}，下一個域]的一套

您實際得到的是：

行：，現場數據對象的另一個數組等] [與現場數據，對象與現場數據等對象]

這是一個腳本的開始，它將靈活處理返回的事物。我省略了很多的情況下，你需要處理：

//loop through json data 
    $.each(data.data.rows,function(i, val){ 
     //+1 to number each row starting at 1 
     var rowNum = i + 1, fields = {}; 

     // Find fields 
     $.each(val, function(j, fieldData) { 
      if(typeof fieldData == 'string') { 
       fields.author = fieldData; 
      } else if(fieldData.field == 'title') { 
       fields.title = fieldData.label; 
      } else { 
       fields[fieldData.field] = fieldData.value; 
      } 
     }); 

     //create table rows and cell and populate with data 
     $('table.stats').append( "<tr>" + "<td>" + rowNum + "</td>" + "<td>" + fields.date + "</td>" +"<td>" + fields.brand_id + "</td>" + "<td>" + fields.author + "</td>" + "<td>" + fields.title + "</td>" + "<td>" + fields.posts + "</td>" + "<td>" + fields.reach + "</td>" + "<td>" + fields.interaction + "</td>" + "</tr>"); 

    });