Question

在HTML中显示时，试图找出对象的键值对中的值显示为未定义的原因 JSON代码如下：

{"products" : [
    {
      "name" : "-------",
      "id" : " --------",
      "price" : "---------",
      "description" : "--------"
    },
    {
      "name" : "-------",
      "id" : " --------",
      "price" : "---------",
      "description" : "--------"
    }
]}

HTML code：

<div id="speakerbox">
  <h1>title</h1>
  <div id="object"></div>
</div>

js code：

$.getJSON( 'products.json', function (products) {
    console.log(products);
    var output = '<ul>';
    $.each(products, function (key, val) {
         output += '<li>' + val.id + '</li>';
    });
    output += '</ul>';
    $('#object').html(output);
});

如果我使用console.log（）方法，当我在chrome中调试时，我可以看到对象，而不是看到值，而是在HTML中输出＆＃34; undefined＆＃34;。当我通过在线验证器运行js时，它告诉我以下内容：＆＃39; $＆＃39;在为这些代码片段定义之前使用它

$.getJSON( 'products.json', function (products) 
$.each(products, function (key, val) 
$('#object').html(output)

我的函数调用有问题吗？ JSON的新手，所以不确定为什么这样做。任何帮助将不胜感激。

Answer 1

products将包含一个如下所示的对象：

{"products" : [ ... ]}

您调用products的变量是对象。它包含一个名为products的属性，其值为数组。要访问它，您需要products.products。

要迭代它，您需要$.each(products.products代替$.each(products。

因此，调用变量response可能更好。说response.products比products.products更有意义。

使用jQuery显示JSON数据的问题

1 个答案: