Если это происходит от
Когда я впервые узнал jQuery, я обычно добавлял такие события:
$('.my-widget a').click(function() {
$(this).toggleClass('active');
});
Узнав больше о скорости выбора и делегировании событий, я прочитал в нескольких местах, что "делегирование события jQuery сделает ваш код быстрее". Поэтому я начал писать код следующим образом:
$('.my-widget').on('click','a',function() {
$(this).toggleClass('active');
});
Это был также рекомендуемый способ воспроизвести поведение устаревшего события .live(). Что важно для меня, так как многие мои сайты постоянно добавляют/удаляют виджетов. Вышеизложенное не ведет себя точно так же, как .live(), поскольку только элементы, добавленные в уже существующий контейнер ".my-widget", получат поведение. Если я динамически добавлю еще один блок html после запуска этого кода, эти элементы не получат связанных с ними событий. Вот так:
setTimeout(function() {
$('body').append('<div class="my-widget"><a>Click does nothing</a></div>');
}, 1000);
Что я хочу достичь:
- старое поведение .live()//означает добавление событий в еще не существующие элементы.
- преимущества .on()
- максимальная производительность для привязки событий
- Простой способ управления событиями
Теперь я присоединяю все события вроде этого:
$(document).on('click.my-widget-namespace', '.my-widget a', function() {
$(this).toggleClass('active');
});
Который, кажется, отвечает всем моим целям. (Да, по какой-то причине он медленнее в IE, не знаю, почему?)
Это быстро, потому что только одно событие привязано к сингулярному элементу, а вторичный селектор оценивается только тогда, когда происходит событие (пожалуйста, исправьте меня, если это не так). Пространство имен является удивительным, поскольку упрощает переключение прослушивателя событий.
Мое решение/вопрос
Итак, я начинаю думать, что события jQuery всегда должны быть привязаны к $(документу).
Есть ли причина, по которой вы не хотели бы этого делать?
Можно ли считать это лучшей практикой? Если нет, почему?
Если вы прочитали все это, спасибо. Я ценю любые/все отзывы/идеи.
Предположения:
- Использование jQuery, поддерживающего
.on()
//как минимум версию 1.7 - Вы хотите, чтобы событие добавлялось к динамически добавленному контенту.
Показания/Примеры: