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

Question

У меня есть большая таблица / сетка, в которой есть события в каждой строке, заголовки таблиц и т. Д.

Вместо того, чтобы я генерировал события или привязывал события к каждой ячейке, было бы лучше поместить «глобальное» событие, и тогда я верю, что когда происходят события щелчка или наведения курсора, оно всплывет до моего «глобального» события на всей таблицу, а затем я получаю фильтр вызывающего события и реагирую.

Я читал об этом раньше, но не уверен, правильно ли я понял.

Есть ли ошибки с таким подходом?

Answer 1

Да, вы правильно поняли, и да, это лучше. С jQuery это так же просто, как связать события напрямую - ищите метод .delegate(). Это позволяет вам помещать обработчик событий в элемент контейнера и сообщать ему, как маршрутизировать события в обработчики на основе обычного селектора jQuery для фильтрации реальных целей событий.

Таким образом:

$('#container').delegate('td.clickMe', 'click', function(e) {
  /* table cell click */
});

Answer 2

Ваша идея прямо в моем мнении. Вы можете достичь этого так:

$("table#yourTable").click(function(evt){
   if($(evt.target).is('td.someTd')) {
     //do whatever you want to do
   }
})

Таким образом, вы связываете только одно событие клика и фильтруете выбранный целевой элемент.

Answer 3

Это вообще хороший подход. Лучший способ добиться фильтрации - использовать встроенную функцию jQuery $().delegate(), как предлагает Пойнти. Это определенно будет более эффективным.

Главное, что нужно помнить, это то, что не все события всплывают по умолчанию. jQuery пытается это исправить, но, насколько я могу судить, событие submit в формах не всплывает в Internet Explorer.

Еще один момент, о котором следует помнить: если вы вызовете event.stopPropagation() (или вернете false из связанной функции), функции, связанные выше по дереву, не будут вызываться.