Работа с событиями javascript, применимыми только к определенному контенту
-
03-07-2019 - |
Вопрос
У меня возникли проблемы с концептуальным пониманием того, что я должен делать, пытаясь создать свое первое крупное веб-приложение на JavaScript.
В зависимости от того, какую вкладку выбрал пользователь, я показываю различное содержимое внутри контейнера.Контент - это больше, чем просто текст, и в нем используются различные функции и события javascript.Я использую Yahoo!Реализация библиотеки пользовательского интерфейса "TabView", но способ решения этой проблемы, вероятно, применим к другим подходам к вкладкам.
То, что я собирался сделать, было в основном следующим:
Создайте отдельные модули для каждой вкладки (например,MYAPP.modules.tabCalendar и MYAPP.modules.tabJournal).Когда пользователь нажимает на другую вкладку (или переходит с помощью кнопок браузера к предыдущему состоянию вкладки), я мог бы вызвать MYAPP.modules[oldModule].disable() и MYAPP.modules[newModules].enable() .Эти функции будут подписываться или отменять подписку на свои пользовательские события (например, общий обработчик кликов, прикрепленный к контейнеру).
Альтернативным подходом к работе с событиями может быть использование единого глобального обработчика кликов.Если щелчок находится внутри контейнера, то определите, какая вкладка выбрана в данный момент, и отправьте событие щелчка в MYAPP.modules[currentTab].onClick().
Или глобальный обработчик кликов может запускать пользовательское событие, на которое модули подписались с момента загрузки страницы, и события onClick каждого модуля будут запускаться и определять, должны ли они что-либо делать.
Кажется, есть много вариантов, но у меня возникли проблемы с поиском ресурсов, рассказывающих о наилучших способах делать подобные вещи.Нахожусь ли я на правильном пути?Как я должен с этим справиться?
Решение
Используйте события, уже встроенные в TabView, чтобы поставить ваш JS в очередь для выполнения каких-либо действий.
http://developer .yahoo.com/yui/tabview/#handlingevents
Для изменения вкладок вам будет сообщено о выбранных предыдущих / следующих вкладках и тому подобном, чего должно быть более чем достаточно для вашего JS, чтобы понять, что он должен делать.Если вы хотите написать слой перевода, который будет смотреть на события и делать что-то на их основе, это прекрасно, но это не является строго необходимым.
Другие советы
Я немного не совсем понимаю суть проблемы.
- Да, вы должны модулировать свой код.
- Попросите каждый модуль настроить обработчики событий для элементов в соответствующем контейнере.
Вот и все.YUI TabView обрабатывает переключение вкладок, поэтому вам не нужно ничего включать / отключать.