Rekursiver jQuery-Ladebefehl

Question

In einem früheren Beitrag zum rekursiven jQuery-Ladebefehl funktioniert der vorgeschlagene Code, hat jedoch einige Einschränkungen. Hier ist der Code, vorgeschlagen worden war und the link:

function loadTree($element) { 
    $element.each(function(){ 
    this.load('url', function(){ 
     loadTree(this.find('.children')); 
    }); 
    }); 
} 

loadTree($('#content')); 

Das Problem mit dem obigen Code ist, dass, wenn Laden nicht erfolgreich ist, die rekursive Schleife endet. In meinem Fall lade ich Bilder nacheinander und erhalte die Bild-URLs über einen AJAX-Aufruf aus der Datenbank. Wenn aus irgendeinem Grund eine Bild-URL nicht korrekt ist, stoppt die Rekursion und ich möchte nicht, dass dies passiert. Der Rest der Bilder muss geladen werden, egal was passiert, denn wenn ich hundert Bildpfade habe, in denen alle gültig sind, mit Ausnahme der ersten, werden alle 100 nicht angezeigt.

Ich habe auch ein anderes verwandtes Problem. Grundsätzlich habe ich 7 Bild-URLs über Ajax abgerufen, ich habe dann 7 HTML-Bild-Tags in einem String gebildet und dann das load-Ereignis mit diesem String nur einmal aufgerufen: all dies um die Anzahl der Browser-Anfragen zu reduzieren. Daher möchte ich den Load-Event-Callback auslösen, nachdem alle 7 Bilder geladen sind. Wenn ich dies jedoch versuche, löst der Load-Ereignis-Callback für jedes Bild aus. Irgendwelche Ideen, wie ein Callback ausgelöst wird, wenn alle Elemente geladen wurden (sei es ein erfolgreiches Laden oder nicht; ein Ladeversuch).

Dank

Answer 1

Ich habe dies nicht in der Lage zu testen, aber es sollte man auf dem richtigen Weg stellen Sie Ihre Frage zu decken.

Mit der Komplexität von dem, was Sie tun, sollten Sie zu der ausführlicheren $.ajax Funktion wechseln, da es zu jedem Zeitpunkt mehr Callback-Funktionen gibt und auf Fehler testet.

function loadTree(element) { 
    var elementsQueried = 0; 
    $(element).each(function(index, value){ 

     $.ajax({ 
      url: 'url', 
      success: function(returnValue){ 
       $(value).html(returnValue); //if successful ajax assign the returned html to the element 
       loadTree($(value).find('.children')); //then continue searching the child tree 
      }, 
      error: function(request,error) { 
       $(value).html('File not found'); //else give some useful error message, but dont keep searching child tree 

      }, 
      complete: function(){ 
       elementsQueried++; 
       if (elementsQueried==$(element).length){ 
        //callback 
       } 
      } 
     }); 

    }); 
    } 

Wie ich schon sagte ich habe es nicht in der Lage gewesen, zu testen, so kann es einige Probleme, insbesondere mit dem Umfang der elementsQueried var und wie diese mit der Rekursion behandelt wird.