Question

以下代码应该显示JSON对象中的id，这是我从服务器获得的。我找不到错误，有人能帮帮我吗？提前谢谢！

调用http://localhost:8387/nscalemc/rest/mon/resourcestatus.json时返回的JSON对象：

{
    "groupStatus": [
        {
            "id": "Application Layer Configuration-ApplicationLayer",
            "time": 1332755316976,
            "level": 0,
            "warningIds": [],
            "errorIds": []
        },
        {
            "id": "Application Layer-ApplicationLayer:nscalealinst2",
            "time": 1333431531046,
            "level": 0,
            "warningIds": [],
            "errorIds": []
        },
        {
            "id": "Application Layer-ApplicationLayer:nscalealinst1",
            "time": 1333431531046,
            "level": 1,
            "warningIds": [
                "documentarea.locked"
            ],
            "errorIds": []
        },
        {
            "id": "Storage Layer-StorageLayerInstance1",
            "time": 1331208543687,
            "level": 0,
            "warningIds": [],
            "errorIds": []
        }
    ]
}

我的HTML文件gadget.html：

<html>
<head>
    <title>Monitor</title>
    <link href="css/gadget.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="js/jquery-1.7.2.js"></script>
    <script type="text/javascript" src="js/gadget.js"></script>
</head>
<body>
    <div id="content"></div>
</body>
</html>

我的JavaScript文件＆＃34; gadget.js＆＃34;：

fetch_JSON();

function fetch_JSON() {
    var url = "http://localhost:8387/nscalemc/rest/mon/resourcestatus.json";

    $.getJSON(url+'?callback=?', function(data) {
        $(data.groupStatus).each(function() {
            $('#content').append('<p>ID: ' + $(this).id+ '</p>');
        });
    });
}

修改谢谢你的解决方案！我通过Firebug调试并发现，getJSON调用以状态＆＃34; 401未授权＆＃34; ..

结束

Answer 1

你应该做

    $('#content').append('<p>ID: ' + this.id+ '</p>');

在这里摆弄http://jsfiddle.net/JaxpC/

编辑 - 当然你应该使用就绪处理程序来确保dom存在（我不认为这是你的情况，因为我有一个ajax调用，但更好的确保

$(function() {
   var url = "http://localhost:8387/nscalemc/rest/mon/resourcestatus.json";

    $.getJSON(url+'?callback=?', function(data) {
        $(data.groupStatus).each(function() {
            $('#content').append('<p>ID: ' + this.id+ '</p>');
        });
    });
});

Answer 2

您正在立即运行脚本并将其放在div之前。当您尝试向其附加数据时，#content不存在。

将脚本移至</body>之前。

Answer 3

$(document).ready(function(){

fetch_JSON();

function fetch_JSON() {
    var url = "http://localhost:8387/nscalemc/rest/mon/resourcestatus.json";

    $.getJSON(url+'?callback=?', function(data) {
        $(data.groupStatus).each(function() {
            $('#content').append('<p>ID: ' + this.id+ '</p>');
        });
    });
}
});

JSON数据不会通过jQuerys getJSON（）显示

3 个答案: