Ajouter une nouvelle image dans jquery et la rendre cliquable

Question

J'essaie d'ajouter une image dans jquery puis de la rendre cliquable J'ai créé le code suivant ci-dessous mais cela ne fonctionne pas.

Il ajoute les images mais ne les rendra pas cliquables.

$(".HeaderGifs").click(function() { 
alert("It Works"); 
}); 


$("#show_images").val()).append("<img class='HeaderGifs' src='images/text.jpg'></img>"); 

Answer 1

Si vous voulez un élément avec une classe particulière pour répondre toujours à l'événement click, vous devez utiliser l'une des méthodes de jQuery pour faire ça. Lorsque vous utilisez simplement click(), vous demandez à jQuery d'appliquer uniquement cet écouteur d'événement aux éléments de cette classe maintenant, au lieu de tous les éléments présents et futurs. A cet effet, jQuery a la méthode on():

$('.HeaderGifs').on('click', function() {....} 

http://api.jquery.com/on/

Modifier: Je dois aussi mentionner la méthode delegate(), juste au cas où vous trouvez plus de valeur à le faire de cette façon:

http://api.jquery.com/delegate/

Answer 2

utilisation .live() ajouter des gestionnaires d'événements aux éléments que vous créez après chargement de la page

Answer 3

Pour la liaison aux éléments apparaissant ou insérés dans le futur (comme dans votre cas vous insérezentier)tag plus tard) vous devez utiliser les fonctions .live() ou .delegate().

La documentation détaillée pour les deux sont disponibles ci-dessous -

.live()

.delegate()

Answer 4

Pour que l'image cliquable utiliser le code ci-dessous:

$('.HeaderGifs').on('click',"img",function() {....}