0

我正在尝试调用 Instagram api 来显示最新的流行图像,首先我使用提供的 api url 调用 jQuery ajax 函数:当我在浏览器中键入 url 时,我将看到一些 xml 文件的结果。所以我认为这是正确的 url,但它在我的 html 文件中不起作用。有谁知道怎么了?

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>

$(function(){

    $.ajax({
        type: "GET",
        dataType: "jsonp",
        cache: false,
        url: "https://api.instagram.com/v1/media/popular?client_id=84abd0d71cb14ad9885cf1dc59594144",
         success:  function(data) {
            for (var i = 0; i < 10; i++) {
                $("#pics").append("<a target='_blank' href='" + data.data[i].link +
                "'><img src='" + data.data[i].images.low_resolution.url +"'></img></a>");
            }
    });

})

</script>
</head>

<body>

<div id="pics">

</div>

</body>
</html>
4

2 回答 2

3

[编辑:根据下面的评论,这个建议不再是最新的,小提琴不再起作用。如果时间允许,我可能会抽出时间来修复它;否则,请注意]

你只是放错了一些牙套。它发生了。如果您还没有使用 IDE 或其他特定于代码的编辑器来提醒您有关不匹配的大括号和标签,那么您应该进行切换!

$(function() {

    $.ajax({
        type: "GET",
        dataType: "jsonp",
        cache: false,
        url: "https://api.instagram.com/v1/media/popular?client_id=84abd0d71cb14ad9885cf1dc59594144",
        success: function(data) {
            for (var i = 0; i < 10; i++) {
                $("#pics").append("<a target='_blank' href='" + data.data[i].link + "'><img src='" + data.data[i].images.low_resolution.url + "'></img></a>");
            }
        }
    });
});

小提琴:http: //jsfiddle.net/KhW2E/

另外,您说如果输入 URL,您会看到一些 XML。正如您可能从名称中所期望的那样,您看到的是 JSON。您正在以正确的方式解决它,但使用正确的术语以确保人们不会感到困惑是有帮助的。

于 2012-03-16T05:30:55.463 回答
0

将脚本放在 之后,</body>以便 ajax 调用找到 div。

于 2012-03-16T05:31:12.593 回答