有效的 JSON，但无法显示数组的元素 - Valid JSON, but can't display elements of array

我已经为此工作了一段时间，我已经阅读了大量关于SO的帖子，试图弄清楚我需要如何做到这一点，但我似乎无法让它工作。我想这一定是我编码方式的某些方面。所以投反对票，但希望一些善良的灵魂能帮助我。

我已经使用 jsonlint 进行了测试，它返回有效。我从服务器收到带有值的响应，除了我只是 alert(响应(之外，我似乎无法在浏览器中获得任何东西; 我需要能够分别访问"cat_id_PK"的值和其他元素，以循环访问并在 html 表格单元格中显示它们。

杰森：

{
"income": [
    {
        "cat_id_PK": 14,
        "cat_name": "test1",
        "cat_amount": "100.00"
    },
    {
        "cat_id_PK": 15,
        "cat_name": "test2",
        "cat_amount": "200.00"
    },
    {
        "cat_id_PK": 34,
        "cat_name": "test3",
        "cat_amount": "300.00"
    },
"expense": [
    {
        "cat_id_PK": 14,
        "cat_name": "tes41",
        "cat_amount": "400.00"
    },
    {
        "cat_id_PK": 15,
        "cat_name": "test5",
        "cat_amount": "500.00"
    },
    {
        "cat_id_PK": 34,
        "cat_name": "test6",
        "cat_amount": "600.00"
    }
]
}

.PHP

    $array = array(
        'income'    => $income,
        'expense'   => $expense,
        'recurring' => $recurring
    );
    echo json_encode($array);

简讯

var request = $.ajax({
    type: "POST",
    url: 'inc/functions.php',
dataType: "JSON",
    data: {action: "display_categories", cur_month:cur_month}
});
request.done(function(response){
     //for each element put values in <td></td> tags.
});

"我已经使用 jsonlint 进行了测试，它回来了。">

不，它没有，不是对于您显示的有错误的 JSON：它在}之后和 "expense" : ... 之前行的逗号之前缺少结束]。但也许这只是您问题中的一个错字，因为您正在使用json_encode()生成 JSON(这不会产生这样的错误(。

"除了我刚刚alert(response);之外，我似乎无法在浏览器中获得任何东西">

所以你当时得到了某种值。

"但是如果我只是提醒response[0]，它将只返回 JSON 数组的第一个字符。">

是的，这是因为response是一个字符串 - 包含 JSON 的原始字符串，您想要解析该字符串以获取对象。除了你不必手动执行此操作，因为一旦你dataType:"json"添加到你的$.ajax()选项，jQuery就会自动执行此操作。

"我实际上缺少这个数据类型，但即使在添加它之后，无论我尝试什么，我都会[Object:Object]或未定义。我实际上只不过是alert(response);">

添加dataType:"json"后，response参数将是一个对象，当您尝试发出警报时，该对象将正确显示为[object Object]。如果您使用console.log(response)那么在浏览器的控制台中，您将看到实际对象。如果您尝试访问不存在的属性，则会undefined。

"我需要能够分别访问cat_id_PK和其他元素的值，以循环访问并在 html 表格单元格中显示它们。">

你的response对象有两个属性，income和expenses，两者都是对象的数组。因此，使用 response.income 访问第一个对象数组，使用 response.expenses 访问第二个对象数组。第一个收入项目是response.income[0]，您询问的财产是response.income[0].cat_id_PK。因此，您可以使用 for 循环，或使用 $.each() 遍历数组并对每个 .cat_id_PK 属性执行某些操作：

var request = $.ajax({
    type: "POST",
    url: 'inc/functions.php',
    dataType: "json",
    data: {action: "display_categories", cur_month:cur_month}
});
request.done(function(response){
  //for each element put values in <td></td> tags.
  var tr = $("<tr></tr>");
  // using traditional for loop for income items
  for(var i = 0; i < response.income.length; i++) {
    $("<td></td>").text(response.income[i].cat_id_PK).appendTo(tr);
  }
  tr.appendTo("#idOfTableHere");
  var tr = $("<tr></tr>");
  // use equivalent jQuery $.each for expense items
  $.each(response.expenses, function(i, v) {
    $("<td></td>").text(v.cat_id_PK).appendTo(tr);
  });
  tr.appendTo("#idOfTableHere");
});

我展示的代码在每个循环中创建新的 td 元素，将它们附加到新的表行，然后在每次循环之后，新行将附加到一个表，我假设该表已经存在于您的页面上，带有 id="idOfTableHere" .

试试这个你错过的数据类型：

var request = $.ajax({
    type: "POST",
    url: 'inc/functions.php',
    data: {action: "display_categories", cur_month:cur_month},
    dataType:"json",
});
request.done(function(response){
     //for each element put values in <td></td> tags.
});