jQuery adjuntar función al evento 'cargar' de un elemento

Question

Quiero adjuntar una función a un elemento jQuery que se activa siempre que el elemento se agrega a la página.

He intentado lo siguiente, pero no funcionó:

var el = jQuery('<h1>HI HI HI</H1>'); 
el.one('load', function(e) { 
    window.alert('loaded'); 
});  
jQuery('body').append(el); 

Lo que realmente quiero hacer es garantizar que otra función jQuery que está esperando alguna #id estar a la página de Don No funciona, así que quiero llamar a esa función cada vez que mi elemento se carga en la página.

---

Para aclarar, estoy pasando el elemento el a otra biblioteca (en este caso se trata de un reproductor de películas pero podría ser cualquier otra cosa) y quiero saber cuando se está añadiendo la elemento EL a la página, si es mi código de reproductor de películas que está agregando el elemento o cualquier otra cosa.

Answer 1

No sé si hay este tipo de evento, lo que se me ocurre es crear el evento "el-load" basado en el tutorial this, y luego extender "append" para saber si el elemento tiene este evento. llamar a ella.

Answer 2

Use LiveQuery (complemento jQuery) y adjunte un evento de carga al elemento ur dom (h1), en este caso.

Answer 3

Si la etiqueta se crea mediante ajax, puede usar un nodo relacionado para suscribirse al evento ajaxSuccess.

http://docs.jquery.com/Ajax/ajaxSuccess

$('#somenode').ajaxSuccess(function(){ 
    if ($('h1').length > 0) { ... } 
}); 

Si sólo está siendo añadido a la DOM por un script local, no estoy seguro de que es posible observar su creación, con la excepción de utilizar un temporizador para sondear por ello.

Answer 4

¿Intenta sobreescribir el método de agregar para que pueda agregar su propio evento?

jQuery.extend(jQuery.fn, { 
    _append: jQuery.fn.append, 

    append: function(j) { 
     this._append(j); 
     j.trigger('append'); 
    } 
}); 

var el = jQuery('<h1>HI HI HI</H1>'); 
el.one('append', function(e) { 
    window.alert('loaded'); 
});  
jQuery('body').append(el); 

Answer 5

Dependiendo de los navegadores que necesita para apoyar hay eventos DOMNodeInserted y DOMNodeInsertedIntoDocument. No puedo dar fe de lo bien que funcionan, pero teóricamente podría vincularse a estos eventos y luego verificar el nuevo nodo y el posible subárbol que se insertó, o simplemente verificar todo el documento nuevamente con un $ (selector) de su elección para detectar el nodo que está esperando ver agregado.

Answer 6

Prueba estas:

var el = jQuery('<h1>HI HI HI</H1>');  
jQuery('body').append(el); 
setTimeout(function(){ 
    window.alert('loaded'); 
},1000);//delay execution about 1 second 

o para estar a salvo ésta:

var el = jQuery('<h1>HI HI HI</H1>');  
jQuery('body').append(el); 
window.checker = setInterval(function(){ 
    if($('someselector').length>0){ //check if loaded 
     window.alert('loaded');    
     clearInterval(window.checker); 
    }  
},200); 

básicamente, esto se repetirá cada 200 ms hasta que el selector se pone resultado, y termina el bucle cuando el resultado está disponible

Answer 7

Quiero adjuntar una función a un elemento jQuery que se activa siempre que el elemento se agrega a la página.

Quiere el livequery plugin, que hace justamente esto. La función live reciente es similar, excepto que no lo llamará cuando se agregue el elemento. Lo usamos todo el tiempo-- funciona muy bien.

Vamos a usar $('h1').livequery(function() {alert('just added');});