Как привязываться к событиям javascript после изменения DOM

У меня есть функция, которая привязывается к тегу tr, чтобы обеспечить эффект наведения мыши следующим образом:

$(".grid tr").bind("mouseenter", function () { $(this).addClass("hover"); }).bind("mouseleave", function () { $(this).removeClass ("наведение"); });

Проблема заключается в том, что сетка загружается через ajax при подкачке, фильтрации и т. д. Это приводит к полной замене сетки и сбою всех привязок событий. Есть ли способ привязки к событию, которое автоматически прикрепляется к соответствующим элементам даже при изменении DOM?

Спасибо!


person Micah    schedule 04.05.2010    source источник


Ответы (3)


$.live — это то, что вам нужно:

$(".grid tr").live("mouseenter", function () { $(this).addClass("hover"); }).bind("mouseleave", function () { $(this).removeClass("hover"); });
person Matthew Flaschen    schedule 04.05.2010
comment
Хотя live() решит проблему, это очень неэффективно. Лучше подключиться к событию успеха вызова ajax и обновить соответствующие узлы dom новым событием. - person Ben Rowe; 04.05.2010

Пожалуйста, используйте .on() с этого момента, так как .live() устарело в jQuery, так как это неэффективно.

$(".grid tr")
    .on("mouseenter", function () { $(this).addClass("hover"); })
    .on("mouseleave", function () { $(this).removeClass("hover"); });
person Chris Yeung    schedule 03.06.2015

В качестве альтернативы вы можете использовать $.delegate

Дополнительная информация: как лучше всего привязать событие клика jQuery к каждому тегу привязки в каждой строке таблицы

person Glenn Barnett    schedule 07.03.2011