jQuery автоматически регистрирует обработчик (и) событий для действий пользователя над элементами, которые добавляются в DOM по ответу Ajax

Для веб-приложения ajax, которое имеет много экранов и переходов, чтобы прикрепить обработчики событий для div, ссылок или кнопок, мы можем написать код:

//Using $.on inside Ajax success handler

$("#container").on("click", "#selector", function(event){

});

Этот подход НЕ будет работать, если контейнер неT существует в DOM. Чтобы заставить его работать, придется использовать документ или тело в качестве контейнера, производительность может быть не очень хорошей.

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

Регистрация функций кода загромождения.

Если обработчик событий уже зарегистрирован, повторная регистрация вызовет два четных обработчика. Таким образом, мы должны отменить регистрацию и зарегистрироваться (или присоединить, только если еще не подключен) - Не уверен насчет проблемы с производительностью.

Есть альтернативы?

Я думаю о следующем:

Сохраните карту контейнера, цели и обработчика события click в одном месте для модуля.

В глобальном обработчике событий ajaxComplete, если контейнер xhr.responseHTML имеет контейнер, присоедините обработчик событий к целевым элементам (присоединяйте, только если еще не подключен).

$(document).ajaxComplete(function(e, xhr, settings){
   for(ind in clickEventListeners){eventlistner = clickEventListeners[ind];
    if($(eventlistner.container,xhr.responseHTML).length > 0){
      $(eventlistner.target).on("click",function(){
      eventlistner.processor(this);
      });
  }
 }
});

Плюсы: все обработчики событий документированы в одном месте для модуля. Нет кода, загромождающего каждый обработчик успеха ajax.

Минусы: я не уверен, если таковые имеются.

Пожалуйста, сообщите, если какие-либо предложения.

Ответы на вопрос(3)

Ваш ответ на вопрос