Odpowiedź to
Możesz używać obietnic getScript()
i czekać, aż wszystkie skrypty zostaną załadowane, na przykład:
$.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
});
SKRZYPCE
KOLEJNY Fiddle
W powyższym kodzie dodanie odroczonego i rozwiązanie go w środku $()
jest jak umieszczenie dowolnej innej funkcji wewnątrz wywołania jQuery, na przykład $(func)
to to samo, co
$(function() { func(); });
tj. czeka, aż DOM będzie gotowy, więc w powyższym przykładzie $.when
czeka, aż wszystkie skrypty zostaną załadowane i DOM będzie gotowy z powodu $.Deferred
wywołania, które jest rozwiązywane w wywołaniu zwrotnym gotowym do DOM.
Do bardziej ogólnego zastosowania przydatna funkcja
Funkcję narzędzia, która akceptuje dowolną tablicę skryptów, można utworzyć w następujący sposób:
$.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);
}
które mogą być używane w ten sposób
var script_arr = [
'myscript1.js',
'myscript2.js',
'myscript3.js'
];
$.getMultiScripts(script_arr, '/mypath/').done(function() {
// all scripts loaded
});
gdzie ścieżka zostanie dołączona do wszystkich skryptów i jest również opcjonalna, co oznacza, że jeśli tablica zawiera pełny adres URL, można to również zrobić i pominąć całą ścieżkę
$.getMultiScripts(script_arr).done(function() { ...
Argumenty, błędy itp.
Na marginesie zwróć uwagę, że done
wywołanie zwrotne będzie zawierało szereg argumentów pasujących do przekazanych w skryptach, przy czym każdy argument reprezentuje tablicę zawierającą odpowiedź
$.getMultiScripts(script_arr).done(function(response1, response2, response3) { ...
gdzie każda tablica będzie zawierać coś podobnego [content_of_file_loaded, status, xhr_object]
. Generalnie nie musimy uzyskiwać dostępu do tych argumentów, ponieważ skrypty i tak będą ładowane automatycznie, a przez większość czasu done
wywołanie zwrotne jest wszystkim, czego naprawdę potrzebujemy, aby wiedzieć, że wszystkie skrypty zostały załadowane, po prostu dodam je dla kompletności oraz w rzadkich przypadkach, gdy trzeba uzyskać dostęp do rzeczywistego tekstu z załadowanego pliku lub gdy potrzebny jest dostęp do każdego obiektu XHR lub czegoś podobnego.
Ponadto, jeśli którykolwiek ze skryptów nie zostanie załadowany, zostanie wywołana procedura obsługi błędów, a kolejne skrypty nie zostaną załadowane
$.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 );})
tutaj?