处理仅适用于某些内容的 Javascript 事件
在尝试制作我的第一个大型 Javascript Web 应用程序时，我无法从概念上理解我应该做什么。
根据用户选择的选项卡，我在容器内显示不同的内容。 内容不仅仅是文本，还使用不同的 Javascript 函数和事件。 我正在使用雅虎！ UI 库的“TabView”实现，但处理此问题的方式可能适用于其他选项卡方法。
我想做的基本上如下：
为每个选项卡创建单独的模块（例如MYAPP.modules.tabCalendar和MYAPP.modules.tabJournal）。 当用户单击不同的选项卡（或使用浏览器按钮导航到上一个选项卡状态）时，我可以调用 MYAPP.modules[oldModule].disable() 和 MYAPP.modules[newModules ].enable()。 这些函数将订阅或取消订阅它们的自定义事件（例如，附加到容器的通用单击处理程序）。
处理事件的另一种方法可能是使用单个全局单击处理程序。 如果单击是在容器内部，则确定当前选择了哪个选项卡并将单击事件发送到 MYAPP.modules[currentTab].onClick()。
或者，全局点击处理程序可以触发自页面加载以来模块已订阅的自定义事件，并且每个模块的 onClick 事件将运行并确定它们是否应该执行任何操作。
似乎有很多选择，但我一直很难找到谈论做这样的事情的最佳方法的资源。 我走在正确的道路上吗？ 我应该如何处理这个问题？
I'm having trouble understanding conceptually what I should do while trying to make my first large Javascript web application.
Depending on which tab a user has selected, I show different content inside a container. The content is more than just text and uses different Javascript functions and events. I am using the Yahoo! UI Library's "TabView" implementation, but the way that this issue should be handled would probably apply to other Tab approaches.
What I was thinking of doing was basically the following:
Create separate modules for each tab (e.g. MYAPP.modules.tabCalendar and MYAPP.modules.tabJournal). When the user clicks on a different tab (or navigates with browser buttons to a previous tab state), I could call MYAPP.modules[oldModule].disable() and MYAPP.modules[newModules].enable(). These functions would subscribe or unsubscribe their custom events (for example, a general click handler attached to the container).
An alternate approach to dealing with events might be to have a single global click handler. If the click is inside the container, then determine which tab is currently selected and send the click event to MYAPP.modules[currentTab].onClick().
Or, the global click handler could fire a Custom Event to which the modules have subscribed since page load, and each module's onClick events will run and determine whether or not they should do anything.
There seem to be a lot of options, but I've been having trouble finding resources that talk about the best ways to do things like this. Am I on the right path? How should I handle this?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
使用 TabView 中内置的事件来排队 JS 执行操作。
http://developer.yahoo.com/yui/tabview/#handlingevents
对于选项卡更改时，您将被告知选择的上一个/下一个选项卡，这样应该足以让您的 JS 弄清楚它应该做什么。 如果您想编写一个翻译层来查看事件并基于它执行某些操作，那很好，但这并不是绝对必要的。
Use the events already built into TabView to queue your JS to do things.
http://developer.yahoo.com/yui/tabview/#handlingevents
For tab changes you'll be told the previous/next tabs selected and such which should be more than enough for your JS to figure out what it should do. If you want to write a translation layer that'll look at the events and do something based on it that's fine but it's not strictly necessary.
我对这个问题有点模糊。
就是这样。 YUI TabView 处理选项卡切换，因此您无需启用/禁用任何内容。
I'm a bit fuzzy on the problem.
That's it. YUI TabView handles the tab switching so you don't need to enable/disable anything.