Попытка заменить $ .live (..) на $ .on (..)

Question

Я читал о замене функций jQuery live() на on(), но они работают так же, как и не-живые функции.

Например, использование $('a').on('click', function(){}); имеет тот же эффект, что и использование: $('a').click(function(){});

Мне нужно повторить функциональность $('a').live('click', function(){}); потому что я добавляю элементы на страницу динамически.

Answer 1

Вам необходимо предоставить селектор:

$('#container').on('click', 'a', function(){})

Где #container является id для статического родителя всех соответствующих якорей.
Попробуйте присоединитьon к ближайшему статическому родителю.

on документы :

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

Когда предоставляется селектор, обработчик события называетсяделегированы.Обработчик вызывается не тогда, когда событие происходит непосредственно в связанном элементе, а только для потомков (внутренних элементов), которые соответствуют селектору.jQuery переносит событие от цели события до элемента, к которому прикреплен обработчик (т. е. от самого внутреннего к внешнему элементу), и запускает обработчик для любых элементов на этом пути, соответствующих селектору.

Answer 2

Эквивалент:

$('a').live('click', function(){});

таков:

$(document).on('click', 'a', function(){});

Но .on() более мощный, потому что вместо того, чтобы присоединять все обработчики событий к объекту document, как.live() делает, вы можете выбрать статического родителя, который будет намного ближе к вашим динамическим объектам и будет более эффективным, особенно если у вас много делегированных обработчиков событий.

Например, если у вас был контейнер divвызывая ссылки, вы должны сделать это:

$("#links").on('click', 'a', function(){});

Селектор в объекте jQuery - это статический объект, с которым вы хотите связать обработчик событий.Селектор в аргументах .on() является селектором, который соответствует объектам, события которых вы хотите обработать, которые будут пузыриться до вашего статического родительского объекта.