Question

我制作了一个AJAX函数，可以获取我的Instagram帐户的四个最新图像。现在我想创建一个append函数，将{2}中的两个第一个图像插入名为<div>的{{1}}中，将另外两个图像插入名为insta-left的第二个<div>中，但我无法找到解决问题的方法：

＆＃13;

insta-right

＆＃13;

如果我这样做，所有图像都会插入var token = 'MY_TOKEN', userid = MY_USER_ID, num_photos = 4; // number of photos i get $.ajax({ url: 'https://api.instagram.com/v1/users/' + userid + '/media/recent', dataType: 'jsonp', type: 'GET', data: { access_token: token, count: num_photos }, success: function(data) { console.log(data); for (x in data.data) { $('.insta-left').append('<img src="' + data.data[x].images.low_resolution.url + '">'); } }, error: function(data) { console.log(data); } });。如何分割我的功能以获取此insta-left中的两张第一张照片以及另一张<div>中的最新照片？

Answer 1

如何定期进行for循环并检查索引？

success: function(data) {
console.log(data);
    for (i = 0; i < data.data.length; i++) {
        if (i < 2) {
            $('.insta-left').append('<img src="' + data.data[i].images.low_resolution.url + '">');
        } else {
            $('.insta-right').append('<img src="' + data.data[i].images.low_resolution.url + '">')
        }
    }

您可能还想考虑Instagram API返回的数量少于您请求的照片数量的情况。

Answer 2

您可以尝试类似

的内容

for(i = 0; i < 2; i++) {
  $('.insta-left').append(...);
}

for(i = 2; i < 4; i++) {
  $('.insta-right').append(...);
}

您可以使用data.data[i]访问图像。

此外，运行一些检查可能是个好主意，这样它就不会尝试追加不存在的图像。像，

if(typeof data.data[i] !== 'undefined') { ... }

Instagram API - 使用jquery获取图像

2 个答案: