jQuery Instagram的答案

【问题标题】：jquery instagramjQuery Instagram的
【发布时间】：2012-04-23 20:01:51
【问题描述】：

使用以下代码---

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">

$(function() {

$.ajax({
    type: "GET",
    dataType: "jsonp",
    cache: false,
    url: "https://api.instagram.com/v1/media/131324529876654234_1491525?client_id=afd15cca7d664a1c964d54bac0488b93",
    success: function(data) {
        for (var i = 0; i < 1; i++) {
            $("#pics").append("<img src='" + data.data[i].images.thumbnail.url + "'></img>");
        }
    }
});
});

    </script>
</head>
<body>
    <div id="pics"></div>
</body>

我想根据我在 api 中传递的 id 显示图像。由于某种原因，它不起作用。谁能告诉我我做错了什么？

谢谢

【问题讨论】：

标签： javascript jquery image api instagram

【解决方案1】：

data.data.images.thumbnail.url

您正在访问的 JSON 中的任何地方似乎都没有数组。

这里有一个简化的 JSON 版本来说明这一点：

{
    ...
    "data": {
        ...
        "images": {
            "low_resolution": {
                "url":"http:\/\/distilleryimage6.s3.amazonaws.com\/e41665005cf611e19896123138142014_6.jpg",
                "width":306,
                "height":306
            },
            "thumbnail": {
                "url":"http:\/\/distilleryimage6.s3.amazonaws.com\/e41665005cf611e19896123138142014_5.jpg",
                "width":150,
                "height":150
            },
            "standard_resolution": {
                "url":"http:\/\/distilleryimage6.s3.amazonaws.com\/e41665005cf611e19896123138142014_7.jpg",
                "width":612,
                "height":612
            }
        },
        ...
    }
}

这是一个演示：http://jsfiddle.net/8Reu2/

【讨论】：

谢谢，这行得通...你能告诉我你是如何获得 JSON 的简化版本的吗？有这个工具吗？
好吧，我读了很多 JSON。所以我只是复制了它，手动删除了我不想要的所有内容。不过，您可以使用“美化器”使其更具可读性：jsonformatter.curiousconcept.com

【解决方案2】：

您使用的 url 用于带回特定的媒体元素（单张照片）。

所以你需要使用data.data.images.thumbnail.url访问它

您可以使用
https://api.instagram.com/v1/media/popular?client_id=afd15cca7d664a1c964d54bac0488b93
检索该用户的流行媒体，然后data.data 确实是一个数组。

看看documentation

【讨论】：

【解决方案3】：

数据不是数组无需引用 data[i] 只是数据 http://jsbin.com/oxetok/edit#javascript,html,live

【讨论】：