Функция нажатия не работает

Question

У меня есть таблица, где я могу добавить строки, используя функцию клона, как это:

new_row = $(table_id+' tbody > tr:last').clone(true).removeAttr('id').insertAfter(table_id+' tbody > tr:last');

каждая строка имеет специальную ячейку, содержимое которой создается вручную, например:

$(new_row).children('.action_2').html('<a class="row_delete"><img src="/images/pack/cross.png" alt="Cancel" /> Cancel</a>');

Проблема в том, что функция $('.row_delete').click(function(){...}) не работает с этими динамически добавляемыми строками, что не так?

Answer 1

Вам нужно использовать функцию .live (.live ('click', function (e) {/ stuff /});) (и для удаления обработчика используйте .die ())

Причиной этого является то, что связывание добавляет обработчик щелчка для каждого указанного элемента (с классом .row_delete в вашем примере), а элементы, которые добавляются позже, не затрагиваются.

Live (), привязывает обработчик намного выше, а затем проверяет, произошел ли зарегистрированный щелчок в одном из указанных элементов.

Имейте в виду, что если в элементе есть другой указанный обработчик, который препятствует распространению события (или всплывает на языке IE), то обратный вызов live () вызываться не будет.

Answer 2

используйте живой метод jQuery для назначения событий, например

$('tr').live('click', function() {
  ///your code here
});

поэтому, когда вы добавите это место, к нему будет присоединено новое событие tr.

Answer 3

Используйте .live() или .delegate() вместо .click(...).

.live():

Прикрепить обработчик к событию для всех элементов, которые соответствуют текущему селектору, сейчас и в будущем.

.delegate()

Присоединить обработчик к одному или нескольким событиям для всех элементов, которые соответствуют селектору, сейчас или в будущем, на основе определенного набора корневых элементов.

Код привязки события будет выглядеть как

$('.row_delete').live('click', function(){...});
// or
$('#my_table_id').delegate('.row_delete', 'click', function(){...});

Answer 4

Функция щелчка применяется к строкам с этим классом при загрузке страницы.

Вы должны использовать метод live (), чтобы заставить это работать:

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

С помощью live вы можете сделать так, чтобы все элементы, которые соответствуют заданному шаблону в течение всей жизни страницы, имели одинаковое поведение.

$('.row_delete').live('click',function(){...})

Это должно сделать это.