Не работает событие click для контента добавленного через append

verfaa

Профессор
Регистрация
29 Янв 2007
Сообщения
416
Реакции
49
Всем привет. Появилась проблема при работе с JQuery:
В div добавляю методом append контент с картинками.
Код:
$('#photos_from_webcamera').append("<div class=\"webcam_photo\" data-id=\"" + msg.url + "\"><a target=\"_blank\" href=\"" + msg.url + "\"><img style=\"margin-bottom:4px;\" src=\"" + msg.thumbnail + "\"/></a><img class=\"delwebcamimg\" style=\"cursor:pointer\" src=\"images/webcam_img_delete.png\"/></div>").fadeIn();

В шапке скрипт, который при клике по добавленной картинке должен выполнять действие, скажем показывать алерт:
Код:
$(document).ready(function() {
 
$("#photos_from_webcamera img").click(function() {
    alert("Click!!! in webcam imgs");
 
});
 
 
});
Но он не работает! Контент нормально добавляется на страницу, но при клике по картинке ничего не происходит! Причем, если выбрать в набор элемент, который уже был изначально на странице, то для него алерт выдается. Не работает событие клик только для картинок, которые динамически добавляются на страницу методом append. Помогите разобраться в чем проблема и как правильно сделать, намучился уже пипец(
 
И не должно. Для любых DOM структур, которые генерируются после события ready нужно использовать методы Для просмотра ссылки Войди или Зарегистрируйся и Для просмотра ссылки Войди или Зарегистрируйся.
Код:
$("#photos_from_webcamera img").live('click', function() {
    alert("Click!!! in webcam imgs");
});
 
Можно использовать window-load конструкцию.
Код:
$(window).load(function(){
    $("#photos_from_webcamera img").click(function() {
        alert("Click!!! in webcam imgs");
    });
});
 
Код:
jQuery(window).load(function(){
        jQuery('div.phocagallery-box-file-third').hover(function(){
            jQuery('div.shadow-over-pic', this).hide();
        }, function(){
            jQuery('div.shadow-over-pic', this).show();
        });
    });
Пример кода с разрабатываемого проекта :) Отлично справляется с элементами добавленными в DOM javascript'ом
 
Назад
Сверху