显示JSON Callback返回的Object中的数据

时间:2015-03-04 12:09:54

标签: javascript jquery jsonp

我正在尝试从服务器获取数据,并且由于跨域请求,我正在使用JSONP回调。我只能显示服务器中的一些数据。 "统计"我可以使用

显示的文件中的信息
  function(rtac) {
    for(i in rtac) {
      rtacs = rtac[i];
      $("#rtac-list").append(rtacs.Stats.ItemCount + "<hr />");
   }

但名为&#34; Data&#34;我遇到了问题。我试过......

$("#rtac-list").append(rtacs.Data.Number + "<hr />");

......它不起作用。

以下是服务器文件返回的内容:

{
    "rtac_edin_0749542489": {
        "Data": {
            "1": {
                "Number": "1",
                "Location": "Non fiction (Sighthill)",
                "Status": "Available",
                "LoanType": "Standard loan",
                "DueDate": "",
                "Shelfmark": "",
                "CopyNo": "A19958",
                "ClassNo": "912.4144"
            }
        },
        "Stats": {
            "DueDateCount": 0,
            "ItemCount": 1
        }
    },
    "rtac_edin_0715810782": {
        "Data": {
            "1": {
                "Number": "1",
                "Location": "Non fiction (Sighthill)",
                "Status": "Available",
                "LoanType": "Standard loan",
                "DueDate": "",
                "Shelfmark": "",
                "CopyNo": "A12675",
                "ClassNo": "941.143"
            },
            "2": {
                "Number": "2",
                "Location": "Non fiction (Sighthill)",
                "Status": "On Loan",
                "LoanType": "Standard loan",
                "DueDate": "31 March 2015",
                "Shelfmark": "",
                "CopyNo": "A12675",
                "ClassNo": "941.143"
            },
            "3": {
                "Number": "3",
                "Location": "Non fiction (Sighthill)",
                "Status": "Available",
                "LoanType": "Standard loan",
                "DueDate": "",
                "Shelfmark": "",
                "CopyNo": "A12675",
                "ClassNo": "941.143"
            }
        },
        "Stats": {
            "DueDateCount": 1,
            "ItemCount": 2
        }
    },
    "rtac_edin_0862671906": {
        "Data": {
            "1": {
                "Number": "1",
                "Location": "Non Fiction (Granton)",
                "Status": "Available",
                "LoanType": "Standard loan",
                "DueDate": "",
                "Shelfmark": "",
                "CopyNo": "0017564",
                "ClassNo": "914.1443"
            }
        },
        "Stats": {
            "DueDateCount": 0,
            "ItemCount": 1
        }
    }
}

这是我的测试代码:

    <html><head><title>RTAC</title>
    <script type="text/javascript"       src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    </head><body>
    <div id='rtac-list'></div>
    <script type="text/javascript">
    $(document).ready(function() {
    var url =  "http://www.lh2cc.net/cwolf/php/dsetask/index.php";
    $.getJSON(url + "?callback=?", null, function(rtac) {
        for(i in rtac) {
            rtacs = rtac[i];
            $("#rtac-list").append(rtacs.Stats.ItemCount + "<hr />");

        }
    });
   });
    </script>
    </body></html>

似乎&#34; Data&#34;的结构文件中的项目给出了问题,因为它有3个项目,我不确定如何处理。

请帮忙谢谢。

1 个答案:

答案 0 :(得分:0)

您需要访问对象的"1"部分:

$("#rtac-list").append(rtacs.Data["1"].Number + "<hr />");

访问所有Data结构:

for (j in rtac.Data) {
    if (rtac.Data.hasOwnProperty(j)) {
        $("#rtac-list").append(rtac.Data[j].Number + "<hr />");
    }
}

编辑:

<html><head><title>RTAC</title>
    <script type="text/javascript"       src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    </head><body>
    <div id='rtac-list'></div>
    <script type="text/javascript">
    $(document).ready(function() {
    var url =  "http://www.lh2cc.net/cwolf/php/dsetask/index.php";
    $.getJSON(url + "?callback=?", null, function(rtac) {
        for(i in rtac) {
            rtacs = rtac[i];
            for (j in rtacs.Data) {
                if (rtacs.Data.hasOwnProperty(j)) {
                    $("#rtac-list").append(rtacs.Data[j].Number + "<hr />");
                }
            }
        }
    });
   });
</script>
</body></html>