Pergunta

Eu estou tendo dificuldade para entender conceitualmente o que devo fazer ao tentar fazer o meu primeiro aplicativo javascript web grande.

Dependendo guia um usuário tenha selecionado que, eu mostrar conteúdo diferente dentro de um recipiente. O conteúdo é mais do que apenas o texto e usa diferentes funções e eventos javascript. Eu estou usando o Yahoo! implementação de UI Library "TabView", mas a maneira que esta questão deve ser tratada provavelmente se aplicam a outros Tab aproxima.

O que eu estava pensando em fazer foi basicamente o seguinte:

Criar módulos separados para cada guia (por exemplo MYAPP.modules.tabCalendar e MYAPP.modules.tabJournal). Quando o usuário clica em uma guia diferente (ou navega com o navegador botões para um estado guia anterior), eu poderia chamar MYAPP.modules [oldModule] .disable () e MYAPP.modules [newModules] .enable (). Estas funções iria subscrever ou anular seus eventos personalizados (por exemplo, um manipulador de cliques geral ligada ao recipiente).

Uma abordagem alternativa para lidar com eventos pode ser ter um único clique manipulador global. Se o clique é dentro do recipiente, em seguida, determinar qual guia está selecionada e enviar o evento clique para MYAPP.modules [currentTab] .onClick ().

Ou, o manipulador global, clique podia disparar um evento personalizado para que os módulos tenham subscrito desde carregamento da página, e eventos onclick de cada módulo será executado e determinar se eles devem ou não fazer nada.

Parece haver um monte de opções, mas eu tenho tido recursos constatação de problemas que falam sobre as melhores maneiras de fazer coisas como esta. Estou no caminho certo? Como devo lidar com isso?

Foi útil?

Solução

Use os eventos já incorporados TabView fazer fila seus JS de fazer as coisas.

http://developer.yahoo.com/yui/tabview/#handlingevents

Para separador muda você será informado o / próximos guias anteriores selecionados e tal que deve ser mais do que suficiente para o seu JS para descobrir o que ele deve fazer. Se você quer escrever uma camada de tradução que vai olhar para os eventos e fazer algo com base no que é bom, mas não é estritamente necessário.

Outras dicas

Eu sou um pouco confuso sobre o problema.

  1. Sim, você deve modularizar seu código.
  2. Faça com que cada manipuladores de eventos de instalação do módulo sobre os elementos em seu respectivo recipiente.

É isso. YUI TabView lida com a comutação de guia para que você não precisa para ativar / desativar qualquer coisa.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top