2009-12-08 9 views
8

Ho bisogno di aggiungere un prototipo e quindi aggiungere scriptaculous e ottenere una richiamata quando entrambi vengono caricati. Attualmente sto caricando prototipo in questo modo:document.createElement ('script') ... aggiunta di due script con una callback

var script = document.createElement("script"); 
script.src = "http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js"; 
script.onload = script.onreadystatechange = callback; 
document.body.appendChild(script); 

avrei potuto fare questo concatenando i callback, ma che sembra cattive pratiche (io non voglio una catena sciocco di 20 metodi di callback quando ho bisogno di caricare più script). Idee?

+0

Perché non aggiungi questi script a un codice HTML per caricarlo con JavaScript? – RaYell

+2

Sto facendo un po 'di codice per essere incollato nell'html di altre persone per incorporare le mie cose. Voglio solo un div vuoto e un riferimento al mio file javascript da incollare. – user199085

+0

@kdiegert: questo riferimento al tuo file js incollato in: vuoi dire tramite ''? –

risposta

33

Vi propongo di utilizzare un piccolo caricatore che si incatena e fa cose per voi. Ad esempio come questo:

Questo script dovrebbe aiutarti a creare i tag di script e chiamare il callback quando tutti i file sono caricati. Richiamare è abbastanza facile:

loadScripts([ 
    "http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js", 
    "http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js" 
],function(){ 
    alert('All things are loaded'); 
}); 

Spero che questo vi aiuterà

+0

Bingo. Grazie molto. – user199085

+0

aysnc.parallel o async.series potrebbe aiutare con questo https://github.com/caolan/async –

+0

'arguments.callee' genera un errore in modalità rigorosa: da https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode "' arguments.callee' non è più supportato.Nel codice normale 'arguments.callee' si riferisce alla funzione di inclusione.Questo caso d'uso è debole: basta nominare la funzione di chiusura! arguments.callee' sostanzialmente ostacola le ottimizzazioni come le funzioni di inlining, perché deve essere reso possibile fornire un riferimento alla funzione non -lined se si accede a argomentis.callee. –

1

Dal Scriptaculous richiede prototipo, si dovrà catena gli ascoltatori, con qualsiasi metodo utilizzato per caricare questi script.

Esistono vari caricatori di script disponibili per caricare script in parallelo, il più rapidamente possibile, ad es. LABjs, ma nessuno sarà di grande aiuto in questo scenario.

Se si finisce per caricare 10-20 script, è consigliabile combinare in anticipo gli script, utilizzando uno strumento come Combiner.

+0

in realtà, questo scenario è * esattamente * quello che LABjs era progettato per risolvere. –

2

A causa di un bug in Internet Explorer, il programma del caricatore ricorsivo di nemisj non funziona correttamente in IE. Può essere risolto impostando un ritardo sulla chiamata ricorsiva come:


function loadScripts(array,callback){ 
    var loader = function(src,handler){ 
     var script = document.createElement("script"); 
     script.src = src; 
     script.onload = script.onreadystatechange = function(){ 
      script.onreadystatechange = script.onload = null; 
      if(/MSIE ([6-9]+\.\d+);/.test(navigator.userAgent))window.setTimeout(function(){handler();},8,this); else handler(); 
     } 
     var head = document.getElementsByTagName("head")[0]; 
     (head || document.body).appendChild(script); 
    }; 
    (function(){ 
     if(array.length!=0){ 
       loader(array.shift(),arguments.callee); 
     }else{ 
       callback && callback(); 
     } 
    })(); 
} 

Questo piccolo trucco lo fa, e spesso è la soluzione in IE, quando si verifica un problema inspiegabile, che è troppo spesso.

Problemi correlati