JQuery.on против .live

Я знаю, что .live() теперь устарел, но я не могу изменить его и сохранить функциональность.

У меня есть быстрый вопрос о функции .on() в jQuery. В настоящее время я использую .live() здесь

Так же:

$('table tr th').live("click", function() {
});

Но, когда я пытаюсь заменить .live() на .on(), он больше не работает так, как предполагалось.

Я пробовал вставить

$('table tr th').on("click", function() {
});

а также

$('table tr').live("click", "th", function() {
});

$('table tr').delegate("th", "click", function() {
});

но безрезультатно.

Почему это и какие шаги я могу предпринять, чтобы заставить его работать правильно?

Ответ 1

Функция on() требует синтаксического обновления, вы должны изменить свой код на:

$('body').on("click", "table tr th", function()...

Ознакомьтесь с этой статьей для получения дополнительной информации: http://www.andismith.com/blog/2011/11/on-and-off/

Ответ 2

Попробуйте следующее:

$('table tr th').live("click", function() {

должен быть

$(document).on("click", "table tr th", function() {

Именно так вы точно подражаете .live. Конечно, вы можете ограничить свой селектор от документа чем-то более значимым, основанным на вашей структуре DOM.

Edit:

Чтобы уточнить, в вашем примере вам необходимо использовать $(document).on(..., потому что таблица не имеет родителей и заменена в течение жизни вашей страницы.

Ответ 3

Убедитесь, что выбранный элемент (th/tr) существует, когда страница загружена изначально. Новый .on не будет работать, если этот селектор будет добавлен позже в DOM.

Try

$('body').on('click', 'thesSelectorForYourTriggerElement', function(){
    //callback
});

Ответ 4

Я как-то догадываюсь, что вы добавляете элементы tr в свою таблицу, а не th.

$('table').on("click", "tr th", function(){});