Ajax Anrufsperre andere Javascript-Code

Question

Ich benutze flex slider auf einer Seite und Seite auch eine Ajax Anruf für andere Job. Mein Problem ist, wenn Benutzer laden die Seite, Ajax Anruf Block flex Slider bis Ajax Anfrage wurde nicht abgeschlossen. Nach Abschluss der Ajax-Anfrage wurde der Flex-Slider erfolgreich geladen. Wenn ich ein Ajax-Skript entferne, wird der Flex-Slider sehr schnell geladen.

Flex Schieber und Ajax-Request beide zwischen diesem Code geschrieben ...

$(document).ready(function(){ 
    $('#carousel').flexslider({ 
     animation: "slide", 
     controlNav: true, 
     animationLoop: true, 
     slideshow: false, 
     itemWidth: 100, 
     itemMargin: 15,   
     asNavFor: '#slider'   
    }); 

    // Rest code of slider will come here 

    // Ajax code start from here  
    $.ajax({ 
      type: "GET", 
      async:false, 
      url: prefixUrl, 
      success: function(results) { 
        $(results).insertBefore('.event_container'); 
      } 
     }); 

}); 

vorschlagen Bitte alle Ideen, so dass Ajax-Aufruf nicht Slider Flex blockieren sollte.

Danke

Answer 1

Async falsch wird warten, bis Ihr Vorgang abgeschlossen erhalten.

try this:

$.ajax({ 
     type: "GET", 
     async:true, 
     url: prefixUrl, 
     success: function(results) { 
       $(results).insertBefore('.event_container'); 
     } 
    }); 

// Update 2:

Eigentlich ist es passiert, da Sie Ajax in Ready-Funktion hinzugefügt haben, um bis Ihre Ajax-Seite bereit Ereignis nicht ausgeführt wird, abgeschlossen zu werden. versuchen Sie es aus dem Dokument bereit zu entfernen.

Answer 2

Wir verwenden Ajax, um keine Post-Back-Operation zu erhalten und in Ihrem Code haben Sie async: false erwähnt, was zu einem synchronen Ajax-Aufruf führt. Der synchrone Ajax-Aufruf bewirkt, dass Sie stoppen/blockieren, bis Sie die Antwort für die vorherige Anfrage erhalten. Versuchen Sie Folgendes:

$.ajax({ 
    type: "GET", 
    url: yourURL, 
    success: function(results) { 
      $(results).insertBefore('.event_container'); 
    }, 
    async:true 
});