Как правильно добавить события к динамически создаваемым элементам? [дубликат]
1,00
р.
На этот вопрос уже дан ответ здесь:
Как использовать плагины jquery с динамическим контентом или почему после AJAX отваливается javascript
(1 ответ)
Закрыт 6 лет назад.
Исользую jquery. Мне нужно сделать, чтобы при наведении на любую ссылку в документе, отображалось бы - alert("ссылка"). Изначально, в документе, у меня уже есть одна ссылка - Первая. Для неё я при загрузке добавляю событие - $("a").hover(function(e) {alert("ссылка") }). Далее при наведение на эту ссылку событие отрабатывает нормально. Но после добавлении ссылок динамически (событие - $("a").click) на новых ссылках событие не срабатывает.
Код страницы:
<!DOCTYPE html> Nexus
$(document).ready(function(e) {
$("a").click(function(e) { $("body").append("Остальные") }) $("a").hover(function(e) {alert("ссылка") }) }) Первая
Подскажите, пожалуйста, как сделать, чтобы событие $("a").hover отрабатывало на все ссылки, в том числе и динамически, в том числе и на добавленные после загрузки документа?
Ответ
@vvtvvtvvt, по сути, вам уже ответил @artem328, но только он почему-то поленился рассказать, что для динамических элементов используется делегированная обработка собятий, и схематически это выглядит так:
$('parent_static').on('event', 'children_dinamic', handler)
Где parent_static - это статичный родительский элемент (лучше ближайший, но подойдёт и body), event - событие, children_dinamic - дочерний динамический элемент, на котором обработчик и должен сработать. При этом указатель this или объект jQuery $(this) в обработчике - имено дочерний динамический элемент.
