Question

我有一个非常简单的函数，它遍历一些JSON数据并将数据添加到列表中：

function printData(file) {
    $.getJSON('json/' + file, function(data) {
        for( var i=0; i <= data.agencies.length; i++ ) {
            $('#results').append(
                '<li class="group">' +
                    '<div class="agency-logo"><img src="images/agency_logos/' + data.agencies[i].logo + '" alt="' + data.agencies[i].name + '" /></div>' +
                    '<div class="agency-info">' + data.agencies[i].name + '<br />' +
                    data.agencies[i].address + '<br />' +
                    data.agencies[i].city + ', '  + data.agencies[i].state + ' '+ data.agencies[i].zip + '<br />' +
                    data.agencies[i].phone + '<br />' +
                    data.agencies[i].email + '</div>' +
                    '<div class="agency-desc">' + data.agencies[i].description + '</div>' +
                '</li>'
            );
        }
    });
}

JSON数据：

{
"agencies" : [
    {
        "name"          : "Test Agency",
        "address"       : "283 Main Street",
        "city"          : "Danbury",
        "state"         : "CT",
        "zip"           : "06810",
        "phone"         : "(555) 555-5555",
        "email"         : "name@website.com",
        "description"   : "This is the description.",
        "logo"          : "logo.gif"

    },
    {
        "name"          : "Test Agency",
        "address"       : "100 Oak Street",
        "city"          : "Roseland",
        "state"         : "NJ",
        "zip"           : "06810",
        "phone"         : "(444) 444-4444",
        "email"         : "name@website.com",
        "description"   : "This is the description.",
        "logo"          : "logo.gif"
    }
]
}

一切都正常工作并按原样输出，但是我输出的第一个项目出现了控制台错误:(我假设每次调用都会出错，但是JS会停止解析错误。）

TypeError：＆＃39; undefined＆＃39;不是一个对象（评估＆＃39; data.agencies [i] .logo＆＃39;）

这是我第一次尝试通过JSON输出，所以我确信我错过了一些东西。

Answer 1

你的JS很好。你的循环不正确

for( var i=0; i <= data.agencies.length; i++ )

应该是

for( var i=0; i < data.agencies.length; i++ )
                ^ notice this change

您正在尝试访问null对象的徽标属性。

修改

数组为0索引。这意味着使用0：
访问第一个元素
data.agencies[0] // <- returns the first element in the array

但是，length属性返回数组中的元素数。在这种情况下，length返回2.

在原始循环for( var i=0; i <= data.agencies.length; i++ )中，您将获得以下内容：

data.agencies[0] // i is less than or equal to 2 data.agencies[1] // i is less than or equal to 2 data.agencies[2] // i is less than or equal to 2 and this returns null

Answer 2

您正在循环基于数组的计数，该计数从0开始。虽然“长度”属性不是基于零的计数属性，因此从1开始计算。您需要执行以下任一修改之一：

    for( var i=1; i <= data.agencies.length; i++ ) --> Works for looping thought non Zero-based data indexes

OR

    for( var i=0; i < data.agencies.length; i++ )  --> Works for JSON and Array-Based

编辑：第一个示例不适用于循环基于数组的数据，如JSON。

通过JSON数据循环时的控制台错误

2 个答案: