Javascript - script load order

I'm guessing that the second parameter (ajax true|false) defaults to true which is why it appears to be loading last. Pass in a 0 as the second parameter to force it to be synchronous.

These are loading asynchronously -- they'll appear in whatever order they load in. To ensure one has loaded before the rest the best thing to do is load the one, and then load the others in the callback that is triggered when the first loads.

Something like

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

Apparently this isn't about script loading but order of execution.

That first tinybox line d oe s execute first, however, the results of calling it might not be visible until after other lines have executed and returned. This is likely due to the fact that the tinybox command is loading a file asynchronously. My above answer still applies, but you'll need to see how tinybox can execute a callback upon a successful completion of an asynchronous event.

The problem is that all the scripts are being loaded asynchronously which basically means they are all being fired simultaneously which means that they will most likely break everything. if you are depending on them being loaded in order..

Check out this past answer on methods for running functions or any javascript really after another.

like tkone had shown in his example, the function will first run the TINY.box.show function before running all the $.getScript functions.

$("#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"); }; 

You should set $.ajaxSetup before your $.getScript:

 $.ajaxSetup({ async: false }); 

For the record, $.getScript() is indeed executed asynchronously, so setup it befor using it.