Функция jQuery.on для будущих элементов, поскольку .live устарел

Мне нужно добавить обработчик для события click будущих <div> элементов, которые еще не существуют. Обычно я использую функцию jQuery .live для обработки этого, но кажется, что он теперь устарел в пользу .on.

Чтобы использовать метод .on таким образом, jQuery предлагает установить параметр селектора, разрешить создание делегированного события и предлагает этот пример кода:

$("#dataTable tbody").on("click", "tr", function(event){
    alert($(this).text());
});

Что все хорошо и хорошо, но что я вложу в свой основной селектор, где у них #dataTable tbody? Обратите внимание, что $.on() не работает.

Ответ 1

Документация jQuery показывает, что вы заменили

$(selector).live(event, handler)

$(document).on(event, selector, handler).

Также у вас есть возможность быть более точным и заменить $(document) на селектор для статического родителя элемента. Например, если у вас есть статический элемент table и tr добавляются динамически в DOM, вы можете сделать что-то вроде $('table#id').on('click', 'tr', ...)

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

Ответ 2

Я просто понял это, как только я разместил этот вопрос... Извините за это!

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

$('body').on('click', '.my_class', function(event) { ...

Это работает, потому что события будут пузыриться. Это, по существу, нормальное барботирование с дополнительным фильтром .my_class.