Каков наилучший подход для привязки событий jQuery к элементам

Question

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

Безусловно, наличие 30+ кликов по различным ссылкам и элементам не может быть хорошей производительностью при регистрации. Используется новая функция «on» jQuery 1.7. Может быть, события должны быть привязаны к элементу body или к чему-то, а затем проверка получит щелчок по элементу и затем оттуда будет работать? Или это не проблема, связывающая множество событий, на самом деле не проблема для современного браузера или производительности?

Answer 1

Вы должны привязать элементы к самому низкому элементу dom, который содержит все выбранные элементы.

Так что если есть div с именем foo, который содержит каждый элемент, вы бы сказали:

$("#foo").on("click", "yourselector", function(){
});

Если ваши элементы распределены по каждому дюйму вашей страницы, вы бы послушали в самом верху:

$(document).on("click", "yourselector", function(){
});

Если я правильно понимаю ваш вопрос, я действительно оченьнадеюсь, предыдущий разработчик не сделал что-то вроде:

$("#someButtonId").on("click", function(){
    //this defeats the whole purpose of on!!!
});

Answer 2

Вы можете привязать одно и то же событие более одного раза к элементу, но если у вас есть до 30 событий щелчка по одной ссылке, вы должны сделать это по-другому. Поместите код для всех тех различных действий, которые вы хотите выполнить, в один обработчик событий вместо того, чтобы связывать каждую мелочь самостоятельно.