Ссылка теряет действие в jQuery

Question

Я создаю и удаляю HTML из div с помощью jQuery (корзина, добавление / удаление элементов). Мне нужно получить доступ к событию .click() ссылки внутри этого div, но оно работает только при первой загрузке страницы - после удаления этой ссылки и повторного добавления она не отвечает ни на какие события jQuery.

Я пробовал функции как внутри, так и снаружи $j(document).ready(function() {}. Как я могу заставить события работать по этой ссылке снова после воссоздания?

Answer 1

Используйте .delegate() вместо .click() (сокращение от .bind('click')):

$(<root-element>).delegate('a', function () {...});

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

Источник: http://api.jquery.com/delegate/

<root-element> может быть documentэлемент или если вы знаете элемент, который всегда присутствует, который является потомком элемента document, лучше всего использовать этот элемент.

Answer 2

Событие .click() работает только для элементов, которые присутствуют в функции.Вам необходимо использовать .live() или .delegate() для присоединения слушателей к элементам, которые динамически создаются после $(document).ready()

Answer 3

Вам нужно заново присоединять событие каждый раз, когда вы перезаписываете содержимое вашего контейнера div или устанавливать обработчик, используя live/delegate/on в зависимости от используемой вами версии jQuery.

Второй метод в целом более элегантный, но имеет недостатки. В частности, вы не можете отменить каскадное действие по умолчанию, даже подключенное к контейнеру.

Answer 4

Попробуйте использовать .detach() вместо .remove(), чтобы сохранить события.В качестве альтернативы используйте делегирование события .