JQuery: ejecución del código para cada nuevo objeto DOM instanciado

Question

Me pregunto si esto es posible en JQuery.

Tengo un código Javascript que crea objetos DOM sobre la marcha, en respuesta a las acciones del usuario. Algunos de esos objetos DOM están en una estructura específica: el contenedor siempre tiene la misma & Quot; class & Quot; atributo.

Lo que me gustaría hacer es, cada vez que una nueva instancia de un objeto DOM con clase " X " está creado, quiero que se ejecute el mismo código Javascript. Ese código agregará un & Quot; onclick & Quot; evento a ese objeto DOM.

Desafortunadamente, no puedo simplemente poner el código que asigna el onclick en document.Ready (), ya que los objetos a los que se une se están creando sobre la marcha, mucho después de que se haya ejecutado document.Ready ().

¿JQuery le permite configurar enlaces persistentes que se vincularán automáticamente a un tipo de objeto DOM, incluso si se genera sobre la marcha?

Answer 1

Esto solía estar cubierto por 'live', 'delegate' o, a veces, 'bind'. Ahora se reemplazan con 'on'; sin embargo, hay algunas advertencias como se discute aquí: Persistencia de enlace de evento de JavaScript

Answer 2

Creo que he encontrado la respuesta a mi propia pregunta, justo en la documentación de JQuery, sorprendentemente.

http://docs.jquery.com/Events/live#typefn

live( type, fn )

Agregado en jQuery 1.3: enlaza un controlador a un evento (como clic) para todos los elementos coincidentes actuales y futuros. También puede enlazar eventos personalizados.

Answer 3

¿Ha buscado el complemento jQuery llamado LiveQuery ?

Desde la página de documentación de LiveQuery:

  

Por ejemplo, podría usar el   siguiente código para enlazar un evento de clic   a todas las etiquetas A, incluso cualquier etiqueta A que   podría agregar a través de AJAX.

$('a') 
>     .livequery('click', function(event) { 
>         alert('clicked'); 
>         return false; 
>     });

  

Una vez que agregue nuevas etiquetas A a su   documento, Live Query enlazará el   haga clic en evento y no hay nada más   eso necesita ser llamado o hecho.

Answer 4

No es posible en jQuery core (como probablemente se haya dado cuenta con otras respuestas que se refieren a algunos complementos) ... esta puede ser una tarea muy simple si no necesita necesariamente toda la funcionalidad de algo como livequery

Para los navegadores que los admiten, use el evento DOM nivel 2 - 'DOMNodeInserted':

http: // www. w3.org/TR/DOM-Level-2-Events/events.html#Events-eventgroupings-mutationevents