Добавление элементов в DOM через ajax и поддержание связи с jQuery

У меня всегда была проблема в случае, когда элементы, добавленные в DOM через AJAX, похоже, не получают jQuery.on() обработчики прикреплены к ним. В итоге я снова добавил к ним события в полной функции AJAX.

Но я всегда задавался вопросом, если jQuery.on() должен быть прикреплен к ним, и если так, то почему бы и нет?

3 ответа

Решение

В jQuery есть различные виды привязок событий.

Код ниже прикрепит click событие только для доступных в настоящее время элементов DOM, и при удалении или повторном добавлении элементов событие больше не будет работать

$(".myElement").on("click", function() {
    console.log("Clicked!");
})

Приведенный ниже метод прикрепит click событие для всех элементов с данным селектором для всего жизненного цикла DOM, независимо от добавления и удаления элементов любое количество раз.

$(document).on("click", ".myElement", function() {
    console.log("Clicked!");
})

Как вы использовали on метод? какая версия jQuery что ты используешь? вместо on, ты можешь использовать delegate также. здесь больше информации о delegate

Какую версию jQuery вы используете?

Ранее, до 1.9 был jQuery.live() - Ссылка на документы API для добавления обработчиков событий к элементам, которых еще не было в DOM. Но с 1,7 jQuery.on() - Ссылка API docs работает таким же образом.

Другие вопросы по тегам