Ответ
Вы можете использовать обещания getScript()
и ждать, пока загрузятся все скрипты, например:
$.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
});
FIDDLE
ДРУГОЙ FIDDLE
В приведенном выше коде добавление Deferred и его разрешение внутри $()
похоже на размещение любой другой функции внутри вызова jQuery, например $(func)
, это то же самое, что
$(function() { func(); });
т.е. он ожидает, пока DOM будет готов, поэтому в приведенном выше примере $.when
ожидает загрузки всех скриптов и готовности DOM из-за $.Deferred
вызова, который разрешается в обратном вызове готовности DOM.
Для более общего использования удобная функция
Служебная функция, которая принимает любой массив скриптов, может быть создана следующим образом:
$.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);
}
который можно использовать так
var script_arr = [
'myscript1.js',
'myscript2.js',
'myscript3.js'
];
$.getMultiScripts(script_arr, '/mypath/').done(function() {
// all scripts loaded
});
где путь будет добавлен ко всем сценариям, а также является необязательным, что означает, что если массив содержит полный URL-адрес, можно также сделать это и оставить путь все вместе
$.getMultiScripts(script_arr).done(function() { ...
Аргументы, ошибки и т. Д.
Кроме того, обратите внимание, что done
обратный вызов будет содержать ряд аргументов, соответствующих переданным в скриптах, каждый аргумент представляет собой массив, содержащий ответ.
$.getMultiScripts(script_arr).done(function(response1, response2, response3) { ...
где каждый массив будет содержать что-то вроде [content_of_file_loaded, status, xhr_object]
. Обычно нам не нужно обращаться к этим аргументам, поскольку скрипты в любом случае будут загружаться автоматически, и большую часть времени done
обратный вызов - это все, что нам действительно нужно, чтобы узнать, что все скрипты были загружены, я просто добавляю его для полноты , и в редких случаях, когда требуется доступ к фактическому тексту из загруженного файла, или когда требуется доступ к каждому объекту XHR или чему-то подобному.
Кроме того, если какой-либо из скриптов не загружается, будет вызван обработчик сбоев, и последующие скрипты не будут загружены.
$.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 );})
сюда?