Jquery AJAX и выяснение, как НЕ вкладывать колбэки для нескольких перезагрузок.

Question

У меня есть сайт с несколькими контейнерами, которым нужно динамически загружать контент через AJAX.

Большинство ссылок внутри контейнеров фактически загружают новые данные в тот же контейнер.

I.E: $("#navmenu_item1").click(function() { $("#navmenu").load(blah); });

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

Теперь с повторными щелчками и AJAX-запросами я не уверен, как двигаться дальше, так как я уверен, что вложенные обратные вызовы не оптимальны.

Каков наилучший способ сделать это?

Включать ли событие .click в текущий файл AJAX, извлекаемый с сервера, а не в index.php? Или я могу как-то перезагрузить DOM?

Спасибо за помощь!

Answer 1

Поскольку вы перезагружаете определенный элемент, вы можете сохранить там прослушиватель событий, используя .delegate(), например:

$("#navmenu").delegate("#navmenu_item1", "click", function() {
  $("#navmenu").load(blah);
});

Это работает путем прослушивания щелчка, всплывающего до элемента #navmenu, и выполнения любых обработчиков, соответствующих селектору. Формат .delegate() .delegate(selector, event, handler).

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

Answer 2

Вам нужна функция .live , которая будет обрабатывать событие для всех элементов, соответствующих селектору, независимо от того, когда они были созданы.