Javascript - Skript Ladereihenfolge

Question

Ich habe diesen Code:

$("#pop_mali_oglas").on('click', function(){ 
     TINY.box.show({url:'<?php echo base_url()?>form/novi_unos/<?php echo $p ?>'}); 
     $.getScript("<?php echo JS ?>vendor/jquery.ui.widget.js"); 
     $.getScript("<?php echo JS ?>tmpl.min.js"); 
     $.getScript("<?php echo JS ?>load-image.min.js"); 
     $.getScript("<?php echo JS ?>canvas-to-blob.min.js");   
     $.getScript("<?php echo JS ?>bootstrap.min.js");   
     $.getScript("<?php echo JS ?>bootstrap-image-gallery.min.js");  
     $.getScript("<?php echo JS ?>jquery.iframe-transport.js"); 
     $.getScript("<?php echo JS ?>jquery.fileupload.js"); 
     $.getScript("<?php echo JS ?>jquery.fileupload-ip.js"); 
     $.getScript("<?php echo JS ?>jquery.fileupload-ui.js"); 
     $.getScript("<?php echo JS ?>locale.js");   
     $.getScript("<?php echo JS ?>main.php");  
     return false;      
}); 

Die erste Zeile wird geladen letzte (TINY.box.show({url:'<?php echo base_url()?>form/novi_unos/<?php echo $p ?>'});) und ich brauche es zunächst zu laden, und dann der Rest. Wie kann ich das machen?

Answer 1

Das Problem ist, dass alle Skripte asynchron geladen werden, was bedeutet, dass sie alle gleichzeitig gefeuert werden, was bedeutet, dass sie höchstwahrscheinlich alles kaputt machen werden. Wenn Sie davon abhängig sind, dass sie in Reihenfolge geladen werden ..

Schauen Sie sich this past answer auf Methoden zum Ausführen von Funktionen oder Javascript wirklich nach dem anderen.

Wie tkone in seinem Beispiel gezeigt hat, wird die Funktion zuerst die Funktion TINY.box.show ausführen, bevor alle $ .getScript-Funktionen ausgeführt werden.

$("#pop_mali_oglas").on('click', function(){ 
      scriptload(function() { 
      getscripts() 
      return false; 
     }); 
}); 

function scriptload(callback) { 
tinyboxfunc() 
callback(); 
} 

function tinyboxfunc() { 
TINY.box.show({url:'<?php echo base_url()?>form/novi_unos/<?php echo $p ?>'}); 
}; 

function getscripts() { 
      $.getScript("<?php echo JS ?>vendor/jquery.ui.widget.js"); 
      $.getScript("<?php echo JS ?>tmpl.min.js"); 
      $.getScript("<?php echo JS ?>load-image.min.js"); 
      $.getScript("<?php echo JS ?>canvas-to-blob.min.js");   
      $.getScript("<?php echo JS ?>bootstrap.min.js");   
      $.getScript("<?php echo JS ?>bootstrap-image-gallery.min.js");  
      $.getScript("<?php echo JS ?>jquery.iframe-transport.js"); 
      $.getScript("<?php echo JS ?>jquery.fileupload.js"); 
      $.getScript("<?php echo JS ?>jquery.fileupload-ip.js"); 
      $.getScript("<?php echo JS ?>jquery.fileupload-ui.js"); 
      $.getScript("<?php echo JS ?>locale.js");   
      $.getScript("<?php echo JS ?>main.php"); 
}; 

Answer 2

Diese werden geladen asynchron - sie in beliebiger Reihenfolge in der Liste sehen sie laden Um auch vor dem Rest das Beste, was die man zu tun geladen hat, wird geladen, und dann die anderen in den Rückruf zu laden. das wird beim ersten Laden ausgelöst.

So etwas wie

$.getScript(first script to load, function(){ 
    // other get script functions 
}); 

---

bearbeiten

Offensichtlich ist dies nicht über Skript Laden aber Reihenfolge der Ausführung.

Die erste TINYBOX-Zeile wird zuerst ausgeführt, die Ergebnisse des Aufrufs sind jedoch möglicherweise erst sichtbar, nachdem andere Zeilen ausgeführt und zurückgegeben wurden. Dies liegt wahrscheinlich daran, dass der Befehl tinybox eine Datei asynchron lädt. Meine obige Antwort gilt immer noch, aber Sie müssen sehen, wie tinybox einen Rückruf nach dem erfolgreichen Abschluss eines asynchronen Ereignisses ausführen kann.

Answer 3

Ich vermute, dass der zweite Parameter (Ajax wahr | falsch) standardmäßig auf wahr, weshalb es scheint, zuletzt geladen wird. Übergeben Sie als zweiten Parameter eine 0, um zu erzwingen, dass sie synchron ist.

Answer 4

Sie $.ajaxSetup vor Ihrem $ .getScript setzen sollen

$.ajaxSetup({ 
    async: false 
}); 

Für die Aufzeichnung $ .getScript() ist in der Tat asynchron ausgeführt, so Setup vor dem sie es zu benutzen.