La risposta è
Puoi usare le promesse con getScript()
e attendere fino a quando tutti gli script sono caricati, qualcosa del tipo:
$.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 are all loaded
});
VIOLINO
UN ALTRO FIDDLE
Nel codice sopra, aggiungere un Deferred e risolverlo all'interno $()
è come inserire qualsiasi altra funzione all'interno di una chiamata jQuery, come $(func)
, è la stessa di
$(function() { func(); });
cioè aspetta che il DOM sia pronto, quindi nell'esempio sopra $.when
attende che vengano caricati tutti gli script e che il DOM sia pronto a causa della $.Deferred
chiamata che si risolve nel callback pronto per DOM.
Per un uso più generico, una funzione utile
Una funzione di utilità che accetta qualsiasi array di script potrebbe essere creata in questo modo:
$.getMultiScripts = function(arr, path) {
var _arr = $.map(arr, function(scr) {
return $.getScript( (path||"") + scr );
});
_arr.push($.Deferred(function( deferred ){
$( deferred.resolve );
}));
return $.when.apply($, _arr);
}
che può essere usato in questo modo
var script_arr = [
'myscript1.js',
'myscript2.js',
'myscript3.js'
];
$.getMultiScripts(script_arr, '/mypath/').done(function() {
// all scripts loaded
});
dove il percorso sarà anteposto a tutti gli script, ed è anche facoltativo, il che significa che se l'array contiene l'URL completo, si potrebbe fare anche questo, e tralasciare il percorso tutti insieme
$.getMultiScripts(script_arr).done(function() { ...
Argomenti, errori ecc.
A parte, notare che il done
callback conterrà un numero di argomenti corrispondenti agli script passati, ogni argomento che rappresenta un array contenente la risposta
$.getMultiScripts(script_arr).done(function(response1, response2, response3) { ...
dove ogni array conterrà qualcosa di simile [content_of_file_loaded, status, xhr_object]
. In genere non è necessario accedere a tali argomenti poiché gli script verranno caricati automaticamente in ogni caso, e la maggior parte delle volte il done
callback è tutto ciò che stiamo realmente cercando di sapere che tutti gli script sono stati caricati, lo sto solo aggiungendo per completezza e per le rare occasioni in cui è necessario accedere al testo effettivo dal file caricato o quando è necessario accedere a ciascun oggetto XHR o qualcosa di simile.
Inoltre, se uno degli script non viene caricato, verrà chiamato il gestore degli errori e gli script successivi non verranno caricati
$.getMultiScripts(script_arr).done(function() {
// all done
}).fail(function(error) {
// one or more scripts failed to load
}).always(function() {
// always called, both on success and error
});
$.Deferred(function( deferred ){$( deferred.resolve );})
qui?