Llamando Javascript en una página después de haber sido cargado por jQuery GET

Question

Imagine un javscript normal de página de llamada en la cabeza. El problema es que algunos de la tampoco contenido cargado hasta que yo haga clic en un enlace. Posteriormente, cuando el enlace se carga el contenido que no funcionará. Esto se debe a que supongo que el javascript ya se ha ejecutado y por lo tanto duerma adherirse a esos elementos llamados más adelante. No está siendo llamado HTML único estándar.

Así, por ejemplo, este es el código que llama a mi HTML externo.

$.get('content.inc.php', {id:id}, function(data){
        $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
           $(this).html(data).slideDown('slow');
        });
    });

Si el html que estaba llamando por ejemplo y etiqueta H1 ya estaba en la página de la Cufon funcionaría. Sin embargo, debido Estoy cargando el contenido a través de las etiquetas H1 método anteriores no será cambiado con mis font.This elegido es sólo un ejemplo. Lo mismo se aplicará para cualquier javascript.

Me wonering si hay una forma de evitar esto sin llamar a la del Javascript así el html cuando su información recibida desde la función anterior

Answer 1

Cufon.refresh() hacer lo que quiere?

Como usted ha dicho Cufon fue sólo un ejemplo , yo también sugieren una más general:

$.get(url, options, function(html, status) {
    var dom = $(html);
    // call your function to manipulate the new elements and attach
    // event handlers etc:
    enhance(dom);

    // insert DOM into page and animate:
    dom.hide();
    $target_element.append(dom); // <-- append/prepend/replace whatever.
    dom.show(); // <-- replace with custom animation
});

Answer 2

Si desea adjuntar eventos a los elementos de la página que se crea de forma dinámica echar un vistazo a la palabra clave "en vivo".

$('H1').live("click", function() { alert('it works!'); });

Hope esto es lo que estaba buscando.

Answer 3

Puede asociar controladores de eventos a los datos que se obtiene a través de la get() dentro de la función de devolución de llamada. Por ejemplo

$.get('content.inc.php', {id:id}, function(data){
    $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){        
        $(this).html(data).find('a').click(function(e) {
            // specify an event handler for <a> elements in returned data
        }).end().slideDown('slow');
    });
});

live() también puede ser una opción para usted, dependiendo de qué eventos desea enlazar a (ya que utiliza live() delegación de eventos, no todos los eventos son compatibles).

Answer 4

Andy probar esto. Se llama el código Cufón después de cada petición AJAX se ha completado y antes de que el HTML es realmente añade a la página.

$.get('content.inc.php', {id:id}, function(data){
    $('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
        $(this).html(data);
        Cufon.replace('h1');
        $(this).slideDown('slow');
    });
});

Answer 5

JavaScript no se ejecuta debido a un motivo de seguridad o beccause jQuery se estaba poniendo innerHTML de este elemento a un texto (que no se interpreta como una javscript) si está contenida. Por lo que la seguridad es el efecto lado.

¿Cómo se puede solucionar?

tratar de encontrar todas las etiquetas script en su respuesta y ejecutarlos como barbechos:

var scripts = myelement.getElementsByTagName("SCRIPT");
var i = 0;

for (i = 0; i < scripts.length; i++)
   eval(scripts[i].innerHTML);