jQuery.click no funciona después de añadir elementos al DOM

Question

Tengo un simple jQuery ('div # estrella'). Clic (función.

La función se activa una vez cuando se carga inicialmente el DOM, pero en una tarde tiempo, agrego una div # star al DOM, y en ese punto la función de clic no funciona.

Estoy usando jQuery 1.4.4, y hasta donde yo sé, no debería necesitar usarlo. live or .bind nunca más. Nunca hay más de una div # estrella en el DOM en un momento dado. Intenté cambiar de id = "star" a class = "star" pero eso no ayudó.

Any sugerencias sobre cómo hacer que esto funcione o ¿por qué no está funcionando?

He tenido el .click dentro de jQuery (documento) .ready, y en un archivo js externo, y ninguno funciona después de agregar el div al DOM.

Answer 1

Aún necesita utilizar eventos en vivo.

http://api.jquery.com/live/

Answer 2

usuario método "directo" $("div#star").live("click", function() {});

Doc

Answer 3

Es necesario utilizar ya sea live o delegate aquí. Nada ha cambiado en este departamento desde jQuery 1.4.4.

Trate de pensarlo así: click y bind adjuntar un evento al elemento en sí, por lo que cuando el elemento desaparece, toda la información sobre el evento también lo hace. live adjunta el evento en el nivel del documento e incluye información sobre qué elemento y tipo de evento se debe escuchar. delegate hace lo mismo, excepto que adjunta la información del evento al elemento principal que desee.

Answer 4

A partir de jQuery 1.7, el método .live() está en desuso. La recomendación actual es usar .on() que proporciona toda la funcionalidad que cubre los métodos anteriores de adjuntar manejadores de eventos. En pocas palabras, no tiene que decidir más ya que en() lo hace todo.

documentación está convenientemente dispuesto en la ayuda para la conversión de los métodos de evento jQuery más edad .bind(), .delegate() y .live()

Answer 5

tratar
.on('event', 'element', function(){ //code })

Answer 6

Esto funciona con jQuery 2.0.3

$(document).on('click', '#myDiv', function() { 
    myFunc(); 
}); 

Answer 7

Puede usar deledate en su lugar en:

$(document).delegate('click', "selector", function() { 
    //your code 
}); 

espero que le ayudará.