заставить jquery .on () работать с динамическим html

Question

Это прекрасно работает в jQuery 1.6.4 для динамического html:

$(".selector").die().live("click", function () {
    alert("clicked");
});

, но в jQuery 1.7.1 я заметил, что .live() устарело и заменено на .on().Как я могу использовать .on() с динамическим HTML?Использование .die().on("click", function()) не работает и не работает .off().on("click", function()).

Спасибо!

Answer 1

Новый метод on работает почти так же, как delegate в более старых версиях jQuery.Вы должны использовать его на элементе предка и предоставить селектор.Так как события DOM всплывают от цели, они в конечном итоге достигнут элемента предка, который вы использовали on.Когда событие достигает этого элемента, цель проверяется на соответствие вашему селектору.Если это так, обработчик события выполняется:

$("#someAncestor").on("click", ".selector", function() {
    //Do stuff
});

Нет необходимости использовать live с тех пор, как был добавлен delegate, некоторое время назад в версии 1.4.При использовании delegate приведенный выше фрагмент будет выглядеть так:

$("#someAncestor").delegate(".selector", "click", function() {
    //Do stuff
});

delegate и on гораздо более эффективны, чем live, поскольку live всегда связывает обработчики событий с document.Это означает, что каждое отдельное событие, инициируемое на странице, должно быть проверено, чтобы увидеть, соответствует ли оно селектору и, следовательно, должно запускаться обработчик события.При on эта проверка требует только события, которые относятся к элементу предка.