問題與Instagram的分頁鏈接API

這是我第一次使用分頁。我遇到的問題是，在點擊某個分頁按鈕後，我會從Instagram API獲得多個回覆。我想我已經縮小了這個問題，因爲這個函數可能會多次觸發。看看我的功能。問題與Instagram的分頁鏈接API

接收數據，並將其分揀到另一功能：

function sortAndStore(data) { 

    var images = data.data, 
     pagLink = data.pagination.next_url; 

    var newImages = []; 

    for (i = 0; i < images.length; i++) { 
     var link = images[i].link, 
      standardRes = images[i].images.standard_resolution.url, 
      thumb = images[i].images.thumbnail.url; 

     var tempImages = new Object(); 

     tempImages.link = link; 
     tempImages.standard_res = standardRes; 
     tempImages.thumbnail = thumb; 

     newImages.push(tempImages); 

    } 

    createLayout(newImages); 

    loadMore(pagLink); 

}

創建所需的佈局（草率，但現在工作）：

function createLayout(data) { 
    var images = data; 

    if ($('#authorizeInsta').css('display') === 'inline') { 

     $('#authorizeInsta').hide(); 
     // Adds additonal structure 
     $('<div id="instagramFeed" class="row-fluid" data-count="0"></div>').insertAfter('.direct_upload_description_container'); 

    } 

    if (!$('#feedPrev').length > 0) { 
     $('<ul id="feedNav" class="pagination"><li><a id="feedPrev" href="#">Prev</a></li><li><a id="feedNext" href="#">Next</a></li></div>').insertAfter('#instagramFeed'); 
    } 

    var count = $('#instagramFeed').data('count'), 
     countParse = parseInt(count); 
     newCount = countParse + 1; 

    $('<div id="row' + newCount + '" class="span3">').appendTo('#instagramFeed'); 
    $('#instagramFeed').data('count', newCount); 


    for (i = 0; i < images.length; i++) { 

     var link = images[i].link, 
      standardRes = images[i].standard_res, 
      thumb = images[i].thumbnail, 
      newImage = '<img data-image="' + standardRes + '" src="' + thumb + '" class="feedImage" id="feedImage' + i + '"/>'; 

     $(newImage).appendTo('#row' + newCount + ''); 

    } 

    imageSelect(); 
}

分頁功能：

function loadMore(link) { 

    var pagLink = link; 

    console.log(pagLink); 

    $('#feedPrev').unbind('click').click(function(event) { 

     $.ajax({ 
      url: link, 
      type: 'GET', 
      dataType: 'jsonp', 
     }) 
      .done(function(data) { 
       sortAndStore(data); 
      }) 
      .fail(function(data, response) { 
       console.log(data); 
       console.log(response); 
      }); 

     return false; 
    }); 

}

我知道這個問題可能在sortAndStore函數

createLayout(newImages); 

loadMore(pagLink);

這裏是分頁鏈接控制檯註銷的內容。問題在於我點擊了三次按鈕，我得到了四個迴應。前兩次都很好。我有一個分頁鏈接，但第三次我收到兩個回覆。

pagLink variable console log

如果你能看到一個不同的問題，或者提出一個不同的方法來組織我的功能，這將不勝感激。 sortAndStore函數中的數據參數是來自原始Instagram API調用的數據。

謝謝，

來源

2014-09-04 Max Baldwin

想通了！問題在於，每次點擊分頁按鈕時，瀏覽器都會爲pagLink存儲一個新值。因此，在點擊兩次按鈕後，有兩個存儲變量進行了兩次分頁API調用。

解決的辦法是在每次新的分頁鏈接通過函數時重新定義變量，而不是定義一個額外的pagLink變量。

所以這個：

function sortAndStore(data) { 

    var images = data.data; 
    pagLink = data.pagination.next_url;

取而代之的是：

function sortAndStore(data) { 

    var images = data.data, 
     pagLink = data.pagination.next_url;

因此，解決辦法是重新定義的變量，而不是添加額外的一個，就像我是偶然做。

來源

2014-09-04 18:23:11

問題與Instagram的分頁鏈接API

回答

相關問題