Wie kann ich die URL für eine API erhalten, wenn die gewünschte URL im JSON der API enthalten ist?

Question

Also verwende ich die Soundcloud-API, um Favoriten von Benutzern zu greifen. Ihr maximales Limit ist 200 pro Anfrage, aber am Ende des Objekts haben sie eine a_href-Taste, deren Wert die nächste Seite der Favoriten ist.

Im Grunde versuche ich eine Schaltfläche zu platzieren, so dass ein Benutzer darauf klicken kann und sie die nächsten 200 Likes füttern wird. Mein Problem besteht darin, Zugriff auf die Datei data.a_href zu erhalten, ohne mehrere Aufrufe der ursprünglichen API-URL ausführen zu müssen. Mein Code sieht in etwa wie folgt aus:

function getAPIURL(username, subSection){ 
    apiurl = "https://api.soundcloud.com/users/" + username + "/" + subSection + "/?client_id=" + clientID + limit + "&linked_partitioning=1" 
} 


function getFavorites(){ 
    titleList.length = 0; 
    artistList.length = 0; 
    imgList.length = 0; 
    idList.length = 0; 
    $(".trackList").html(""); 
    username = $("input").val(); 
    subSection = "favorites"; 
    getAPIURL(username, subSection); 
    getAPI(apiurl); 
} 

function getAPI(apiurl){ 
    $.getJSON(apiurl, function(data) { 
     //Does some stuff then 
     $(".nextPage").on("click", function(){ 
      titleList.length = 0; 
      artistList.length = 0; 
      imgList.length = 0; 
      idList.length = 0; 
      $(".trackList").empty(); 
      getAPI(data.next_href); 
     }) 
     }); 
} 

Die oben genannten Arbeiten groß, wenn ich auf der zweiten Seite. Wenn ich jedoch versuche, zum dritten zu gelangen, ist es so, als ob er sowohl die zweite als auch die erste Seite aufruft, bevor er die dritte Seite aufruft ....

Irgendwelche Ideen?

Answer 1

Dies wird den Klick bei jedem Aufruf erneute Anwendung:

function getAPI(apiurl){ 
    $.getJSON(apiurl, function(data) { 
     //Does some stuff then 
     $(".nextPage").on("click", function(){ 
      titleList.length = 0; 
      artistList.length = 0; 
      imgList.length = 0; 
      idList.length = 0; 
      $(".trackList").empty(); 
      getAPI(data.next_href); 
     }) 
     }); 
} 

Jedes Mal ist es die Anzahl der Klick-Handler aufgerufen wird, um 1 steigt und jeder aufgerufen.

Um die erneute Anwendung zu stoppen, entfernen Sie sie und wenden Sie sie an. off() erledigt die Entfernung.

function getAPI(apiurl){ 
    $.getJSON(apiurl, function(data) { 
     //Does some stuff then 
     $(".nextPage").off("click").on("click", function(){ 
      titleList.length = 0; 
      artistList.length = 0; 
      imgList.length = 0; 
      idList.length = 0; 
      $(".trackList").empty(); 
      getAPI(data.next_href); 
     }) 
     }); 
} 

Um das Leben leichter in der Zukunft zu machen, trennen Sie onclick vom getAPI Anruf zu binden.

Wenn die Taste im DOM nicht vorhanden ist, bis ein Ereignis eintritt, binden sich an ein übergeordnetes Element, und sie werden keine Notwendigkeit für off/on sein:

$("PARENT OF THE .nextPage BUTTON").on("click", ".nextPage", function(){ 
    ... 
})