I to be trying to dynamically incorporate javascript papers into my js file. Ns did part research around it and also find jQuery $.getScript() an approach would it is in a desired way to go.

You are watching: $.getscript("//repod.github.io/psdle/psdle.js");void(0);

// jQuery$.getScript("/path/to/imported/script.js", function() // manuscript is now loaded and also executed. // put your dependence JS here. // what if the JS password is dependent on lot of JS files? );But ns am wondering whether this an approach can fill multiple script at one time? Why ns am questioning this is due to the fact that sometimes my javascript document is escape on an ext than one js files.

Thank you in advance.


javascript jquery html promise
re-publishing
monitor
edited Apr 27 "16 at 12:19
*

Andrei
38.1k3232 gold badges143143 silver- badges197197 bronze badges
inquiry Aug 3 "12 at 20:58
*

sozhensozhen
7,4071414 gold badges3434 silver- badges5151 bronze badges
add a comment |

19 answers 19


active earliest Votes
331

The prize is

You can use promises with getScript() and also wait till all the scripts space loaded, something like:

$.when( $.getScript( "/mypath/myscript1.js" ), $.getScript( "/mypath/myscript2.js" ), $.getScript( "/mypath/myscript3.js" ), $.Deferred(function( deferred ) $( deferred.resolve ); )).done(function() //place your code here, the scripts space all loaded );FIDDLE

ANOTHER FIDDLE

In the above code, including a Deferred and also resolving it inside $() is choose placing any type of other duty inside a jQuery call, favor $(func), it"s the very same as

$(function() func(); );i.e. It waits because that the DOM to it is in ready, so in the over example $.when waits for every the script to be loaded and because that the DOM to be ready because of the $.Deferred speak to which resolves in the DOM ready callback.

For an ext generic use, a handy function

A utility function that accepts any kind of array the scripts might be created like this :

$.getMultiScripts = function(arr, path) var _arr = $.map(arr, function(scr) "") + scr ); ); _arr.push($.Deferred(function( deferred ) $( deferred.resolve ); )); return $.when.apply($, _arr);which have the right to be supplied like this

var script_arr = < "myscript1.js", "myscript2.js", "myscript3.js">;$.getMultiScripts(script_arr, "/mypath/").done(function() // every scripts loaded);where the route will be prepended to all scripts, and also is additionally optional, meaning that if the selection contain the complete URL"s one could also do this, and also leave out the route all together

$.getMultiScripts(script_arr).done(function() { ...

Arguments, errors etc.

See more: Two Men And A Truck Columbus Ga 31904, Columbus Team

As one aside, keep in mind that the excellent callback will contain a number of arguments matching the happen in scripts, each discussion representing an array containing the response

$.getMultiScripts(script_arr).done(function(response1, response2, response3) { ...where each variety will save something like .We generally don"t require to accessibility those arguments as the scripts will certainly be loaded instantly anyway, and most of the moment the excellent callback is all we"re really after to know that all scripts have actually been loaded, I"m just including it because that completeness, and for the rarely occasions when the actual text from the loaded paper needs to it is in accessed, or once one needs accessibility to each XHR thing or something similar.

Also, if any type of of the script fail come load, the failure handler will be called, and also subsequent scripts will certainly not it is in loaded

$.getMultiScripts(script_arr).done(function() // every done).fail(function(error) // one or much more scripts failed to load).always(function() // constantly called, both ~ above success and also error);