Intentando activar el evento onload en la etiqueta del script


100

Estoy intentando cargar un conjunto de scripts en orden, pero el evento onload no se activa 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 los eventos nativos como el.onload no se activan cuando se usa jQuery para agregar el elemento al DOM. Si uso nativo document.body.appendChild(el), se dispara como se esperaba.


visita: este enlace: stackoverflow.com/questions/4845762/… Este es el uso completo
Jitesh

Respuestas:


143

Debe establecer el srcatributo después del onloadevento, por ejemplo:

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

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

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

Recuerde que debe verificar la readystatecompatibilidad con IE. Si está utilizando jQuery, también puede probar el getScript()método: http://api.jquery.com/jQuery.getScript/


11
eso en realidad no lo soluciona. Pero si solo uso en document.body.appendChild(el)lugar de $ ('body'). Append (el); luego, el evento onload se dispara como se esperaba.
chovy

34
¿Pueden ayudarme a entender por qué es importante realizar pedidos?
chovy

12
@David ¿Por qué no agregar el elemento al final, como se recomienda en lugares como html5rocks.com/en/tutorials/speed/script-loading ? Eso debería hacer que el orden en el que agregue el detector de eventos y lo establezca srcen irrelevante.
Stuart P. Bentley

3
Tengo curiosidad: ¿Por qué es importante adjuntar un elemento al DOM antes de configurar los atributos onloady src?
Jake Wilson

1
Si el script está almacenado en caché, tan pronto como agregue el src, el elemento se carga y la carga no se activa. Agregar onload antes de src garantizará que onload se active para los scripts almacenados en caché.
JonShipman
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.