3

我最近开始了一个关于 HTML、JSON 和 jQuery 的演示项目。我现在想要实现的是从 JSON 文件中获取数据并将其加载到我的表中。我是 JSON 新手,所以我花了一天时间才一无所获,数据没有加载到我的表中。

这是我的 JSON 文件“contact.json”:

{
    "length": 2,
    "info": [
        {
            "fullname":"Noob Here",
            "email":"myemail@server.com",
            "phone":"123456",
            "badgeid": "11111",
        },
        {
            "fullname":"Newbie There",
            "email":"hisemail@server.com",
            "phone":"589433",
            "badgeid": "11112",
        }
    ]
}

我加载数据的脚本:

window.onload = function () {
    var contacts;
    setTimeout(loadData(contacts, "contact"), 2000);
    $(contacts.info).each(function(index, element){  
        $('#contacts').append('<tr><td>' + element.fullname + '</td><td>'
            + element.email + '</td><td>'
            + element.phone + '</td><td>'
            + element.badgeid + '</td></tr>');       
    })
};

function loadData(myobject, myfile){
    myobject = $.parseJSON("../data/" + myfile + ".json");
};

请注意,我可能想从各种 JSON 文件中加载,所以 loadData 那里有一些参数。否则,它将直接解析 JSON 文件。

我已经在 HTML 中声明了一个“#contact”表。错误控制台说:

未捕获的 SyntaxError:意外的令牌。
jQuery.extend.parseJSONjquery.min.js:442
loadDataHomepage.html:23
window.onload

为什么会出现这个错误?我该如何解决这个问题?

4

2 回答 2

4

参考这个帖子

JSON.parse 意外字符错误

我知道你解析了已经解析的 JSON

您可以按如下方式替换脚本:

    window.onload = function () {
       var contacts;
       $.getJSON('contact.json',function(contacts)
        {
          $(contacts.info).each(function(index, element){  
               $('#contacts').append('<tr><td>' + element.fullname + '</td><td>'
                 + element.email + '</td><td>'
                 + element.phone + '</td><td>'
                 + element.badgeid + '</td></tr>');       
           })  
        });
     };
于 2012-04-10T04:42:59.460 回答
2

通过 JSON 验证器运行您的 JSON,例如JSONLint.com。您的 JSON 中有语法错误:

{
    "length": 2,
    "info": [
        {
            "fullname":"Noob Here",
            "email":"myemail@server.com",
            "phone":"123456",
            "badgeid": "11111",  <---- Do not put a comma before a curly brace
        },
        {
            "fullname":"Newbie There",
            "email":"hisemail@server.com",
            "phone":"589433",
            "badgeid": "11112",  <---- remove comma before curly brace
        }
    ]
}

您的 JSON 应如下所示:

{
    "length": 2,
    "info": [
        {
            "fullname":"Noob Here",
            "email":"myemail@server.com",
            "phone":"123456",
            "badgeid": "11111"
        },
        {
            "fullname":"Newbie There",
            "email":"hisemail@server.com",
            "phone":"589433",
            "badgeid": "11112"
        }
    ]
}
于 2012-04-10T04:02:24.993 回答