Question

我正在尝试从包含json-data的html文件中加载名称。问题是页面是空白/白色，并且在firefox调试器中没有错误消息。

test.html和persondb.html位于同一台服务器上。

的test.html

 <!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>JSON Exempel</title>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
</head>
<body>

<ul id="person-lista">

</ul>

<script>

$.ajax({
    url: "http://www.mywebbpage.com/ajax/persondb.html", // not the realname
    data: {
        limit: 5,
        name: 'ra'
    },

    success: function (response) {

        var personArray = response.personer;
        for(var i=0; i < personArray.length; i++) {
            var person = personArray[i];
            $('#person-lista').append('<li>' + person.fnamn + '</li>');
        }
    }
});

</script>
</body>
</html>

persondb.html

{
"personer": [{
    "fnamn": "RACHELLE",
    "enamn": "ZWIEFELHOFER",
    "epost": "rachelle.zwiefelhofer@somefakedomain.nu"
}, {
    "fnamn": "RACQUEL",
    "enamn": "JOH",
    "epost": "racquel.joh@somefakedomain.nu"
}, {
    "fnamn": "RAE",
    "enamn": "BRAVARD",
    "epost": "rae.bravard@somefakedomain.nu"
}, {
    "fnamn": "RAFAEL",
    "enamn": "SAGASTUME",
    "epost": "rafael.sagastume@somefakedomain.nu"
}, {
    "fnamn": "RAISA",
    "enamn": "REINES",
    "epost": "raisa.reines@somefakedomain.nu"
}]
}

是persondb.html格式不正确吗？那是什么原因？在浏览器中加载persondb.html时，它看起来像以下

{ "personer": [{ "fnamn": "RACHELLE", "enamn": "ZWIEFELHOFER", "epost": "rachelle.zwiefelhofer@somefakedomain.nu" }, { "fnamn": "RACQUEL", "enamn": "JOH", "epost": "racquel.joh@somefakedomain.nu" }, { "fnamn": "RAE", "enamn": "BRAVARD", "epost": "rae.bravard@somefakedomain.nu" }, { "fnamn": "RAFAEL", "enamn": "SAGASTUME", "epost": "rafael.sagastume@somefakedomain.nu" }, { "fnamn": "RAISA", "enamn": "REINES", "epost": "raisa.reines@somefakedomain.nu" }] }

或者＆＃34;相同的原产地政策是否有问题＆＃34; ？但文件位于同一服务器（同一文件夹）

Answer 1

您需要解析JSON，然后才能在循环中访问它 -

success: function (response) {

    var res = JSON.parse(response);
    var personArray = res.personer;
    for(var i=0; i < personArray.length; i++) {
        var person = personArray[i];
        $('#person-lista').append('<li>' + person.fnamn + '</li>');
    }
}

Answer 2

您必须解析JSON，就像EatPeanutButter所提到的那样，或者您必须使用html-page的响应发送正确的Content-Type（application / json）。你的JSON形式很好。

从textfile加载jsondata时的空白页面

2 个答案: