Tratando de disparar el evento onload en la etiqueta de script

Question

Tratando de disparar el evento onload en la etiqueta de script

Estoy tratando de cargar un conjunto de scripts en orden, pero el evento onload no se está disparando para mí.

    var scripts = [
        '//cdnjs.cloudflare.com/ajax/libs/less.js/1.3.3/less.min.js',
        '//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.min.js',
        MK.host+'/templates/templates.js'
    ];

    function loadScripts(scripts){
        var script = scripts.shift();
        var el = document.createElement('script');
        el.src = script;
        el.onload = function(script){
            console.log(script + ' loaded!');
            if (scripts.length) {
                loadScripts(scripts);
            }
            else {
                console.log('run app');
                MK.init();
            }
        };

        $body.append(el);
    }

    loadScripts(scripts);

Supongo que eventos nativos como el.onload no se dispara cuando se usa jQuery para anexar el elemento al DOM. Si utilizo nativo document.body.appendChild(el) entonces se dispara como se esperaba.

74

javascript jquery onload

Author: Peter Mortensen, 2013-04-26

Source

1 answers

score 99 · Accepted Answer

Debe establecer el atributo src después de el evento onload, f. ej:

el.onload = function() { //...
el.src = script;

También debe agregar el script al DOM antes de adjuntar el evento onload:

$body.append(el);
el.onload = function() { //...
el.src = script;

Recuerde que debe comprobar readystate para el soporte de IE. Si está utilizando jQuery, también puede probar el método getScript(): http://api.jquery.com/jQuery.getScript /