Comment exécuter une fonction javascript après le chargement d'un JS spécifique?

Question

J'ai fait une fonction js pour inclure un autre javascript dans mon code HTML. Je dois m'assurer que le script que j'ai chargé à l'aide de la fonction a terminé le traitement et ensuite seulement aller plus loin dans mon script original. J'ai besoin de savoir que le script a chargé pour utiliser ses fonctions à venir.

function loadBackupScript(){ 
    var script = document.createElement('script'); 
    script.src = 'http://www.geoplugin.net/javascript.gp'; 
    script.type = 'text/javascript'; 
    var head = document.getElementsByTagName("head")[0]; 
    head.appendChild(script); 
} 

Comment je fais ça?

Answer 1

function loadBackupScript(callback) { 
    var script; 
    if (typeof callback !== 'function') { 
     throw new Error('Not a valid callback'); 
    } 
    script = document.createElement('script'); 
    script.onload = callback; 
    script.src = 'http://www.geoplugin.net/javascript.gp'; 
    document.head.appendChild(script); 
} 

loadBackupScript(function() { alert('loaded'); }); 

Answer 2

Ajouter ceci à votre fonction:

// all cool browsers 
script.onload = doSomething; 
// IE 6 & 7 
script.onreadystatechange = function() { 
if (this.readyState == 'complete') { 
    doSomething(); 
} 

Si vous ne faites pas confiance à ces événements, vous pouvez également utiliser setTimeout() pour vérifier l'existence de la fonction. Un bon article sur ce qui peut être trouvé ici:

http://www.ejeliot.com/blog/109

Answer 3

Je recommanderais d'utiliser LABJs pour cela.

utilisant, vous pouvez le faire

$LAB 
.script("framework.js") 
.wait(function(){ 
    //called when framework.js is loaded 
}) 
.script("init.js") 
.wait(function(){ 
    //called when init.js is loaded 
}); 

Ceci est multi-navigateur et souvent plus efficaces que hardcoding balises de script dans votre code HTML en raison de la façon dont il supporte les téléchargements parallèles.

Vous pouvez en savoir plus à ce sujet here