Почему мое связанное событие не применяется к вновь созданным элементам?

Question

У меня есть функция щелчка, которая добавляет изображение в div с классом selectedimage.Я пытаюсь создать еще одну функцию щелчка, которая ссылается на «selectedimage», однако она не запускается.Это потому, что он не существовал при первой загрузке DOM?Спасибо.

$(".articlethumb").bind('click', function() {
var currentid = $(this).attr("id");
var medium = $(this).find(".thumb-medium").text();
var mediumimage = "<img id='" + currentid + "' class='selectedimage' src='" + medium + "' />";
$("#mainimage").html(mediumimage);
});

$(".selectedimage").bind('click', function() {
alert("test");
});

Answer 1

Вместо «bind» используйте «live».Тот же синтаксис, кроме live, будет применять обработчики событий ко всем существующим совпадающим элементам и любым будущим (пока не существующим) совпадающим элементам.

Answer 2

.bind влияет только на элементы, уже находящиеся в DOM.

Чтобы "привязать" событие ко всем существующим и будущим элементам, используйте .live:

$('selector').live(click, function() {

});

Answer 3

Используйте .live .

$('.articlethumb').live('click',function(){
    your code here
})

Как вы и подозревали, это связано с тем, что элемент отсутствует в dom, когда событие связано, и live исправляет это.