Проблемы связывания событий для динамически созданных элементов с jQuery

Question

$.each(data, function(i,data) {
...[cut]...
    +"<a id=\"contact_"+data.id+"_delete\" href=\"/user/contact/delete/ticket_id/"+data.ticket_id+"/contact_id/"+data.id+"\">Delete</a>"
...[cut]...
    $("#contact_"+data.id+"_delete").live('click',function() {
        var href = this.attr('href');
        alert(href);
        return false;
    });

.

У меня есть следующий образец кода (неактуальные детали вырезаны для простоты).То, что у меня есть функция, которая перерисовывает строки (TR) таблицы.Каждая строка имеет ссылку «Удалить» в конце строки, которая вызывает URL / User / Contact / Delete / Ticket_id / {$ Ticket_id}

Затем (в пределах одного цикла) я хочу связать событие щелчка к вновь созданной ссылке.Однако, когда я нажимаю на ссылку, браузер покидает страницу и отправляется на URL, а не переходить на функцию нажатой ссылки.

Во-первых, я обязательно связываю событие Щелков правильно?

Во-вторых, я правильно извлекаю атрибут элемента «Href»?

Answer 1

В дополнение к тому, что говорит @charlietfl, вы можете иметь один обработчик для всех ваших удаленных элементов.Просто добавьте один и тот же класс для всех из них, таких как class="contact_delete", а затем используйте .on() для нацеления всех из них:

+'<a class="contact_delete" id="contact_'+data.id+'_delete" ...

.

Обратите внимание, что если вы используете отдельные кавычки, вам не нужно избежать всех ваших двойных кавычек.

$('body').on('click', '.contact_delete', function() {
    var href = $(this).attr('href');
    alert(href);
    return false;
});

.

Answer 2

Вам нужно обернуть «это» в $ (), чтобы сделать его объектом jQuery, чтобы использовать методы jQuery

 var href = $(this).attr('href');

.

live () устарел (но работает в 1.7.1), поэтому вы должны рассмотреть возможность использования более тока () метода