Google Web Designer: Überprüfen, ob initAd() geladen wurde

Question

Ich versuche, Bilder auf einem Anzeigenblock dynamisch zu ändern, der mit GWD erstellt wurde.

Ich habe einen JSON-Feed, der aufgerufen wird, nachdem initAd() in der Funktion handleWebComponentsReady() aufgerufen wurde.

Lokal funktioniert das gut, die Anzeige wird initialisiert und dann wird der Ajax-Aufruf gemacht, um eine Liste von Assets abzurufen, ich benutze dann jQuery, um das Bild src zu den neuen Bildern zu tauschen.

Nach der Bereitstellung auf einem Live-Server wird es jedoch nicht funktionieren, es sieht so aus, als würde die Funktion initAd() wesentlich länger laden, was die Auswirkung hat, dass jQuery die zu manipulierenden img-Tags nicht finden kann .

Ich habe versucht, meinen Ajax-Aufruf in das Ereignis handleAdInitialized() zu platzieren, das nach der Initialisierung der Anzeige aufgerufen werden soll, aber bevor die Anzeige selbst gerendert wurde. Dies scheint jedoch nicht der Fall zu sein.

Ich habe auch versucht, ein Timeout für den Ajax Anruf hinzufügen, um ein paar Sekunden warten, bevor Sie die Änderungen, die funktioniert, aber nicht ideal ist. Hier

ist eine Probe von meinem Feed, es ist sehr einfach

{ 
    image1: "assets/img1.jpg", 
    image2: "assets/img2.png", 
    image3: "assets/img3.png", 
    image4: "assets/img4.png", 
    image5: "assets/img5.png" 
} 

Und hier sind die Ereignisse

function handleWebComponentsReady(event) { 
    // Start the Ad lifecycle. 

    setTimeout(function() { 
     gwdAd.initAd(); 
    }, 0); 


    } 

    /** 
    * Handles the event that is dispatched after the Ad has been 
    * initialized and before the default page of the Ad is shown. 
    */ 
    function handleAdInitialized(event) { 
    $.ajax({ 
     url: "link-to-feed", 
     jsonpCallback: "callback", 
     dataType: "jsonp", 
     async: false, 
     success: function(response) { 
      console.log(response); 

      $('#img1').css('background-image','url("' + response.image1 + '")'); 
      $('#img2').css('background-image','url("' + response.image2 + '")'); 
      $('#img3').css('background-image','url("' + response.image3 + '")'); 
      $('#img4').css('background-image','url("' + response.image4 + '")'); 
      $('#img5').css('background-image','url("' + response.image5 + '")'); 

     }, 
     error: function(response){ 
      console.log("error"); 
     } 
    }); 
    } 

Gibt es eine Möglichkeit zu erkennen, wenn initAd() vollständig abgeschlossen ist und dann rufen mein Ajax?

Jede Hilfe wäre willkommen.

Dank

Answer 1

was setzen, während Fall zu prüfen, ob response.image1, response.image2 .. sind null, warten, wenn ja, dann, bis die Werte dort

while (response.image1 == null && response.image2 == null && response.image3 == null && response.image4 == null) {}; 

bereit sind, nachdem sie dort Werte sit sind dann

$('#img1').css('background-image','url("' + response.image1 + '")'); 
      $('#img2').css('background-image','url("' + response.image2 + '")'); 
      $('#img3').css('background-image','url("' + response.image3 + '")'); 
      $('#img4').css('background-image','url("' + response.image4 + '")'); 
      $('#img5').css('background-image','url("' + response.image5 + '")');