Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Micilini Roll

Ultilizar array em getelementbyid?

Por , em Javascript

Recommended Posts

Micilini Roll    49

Micilini Roll
Postado

pessoal quero diminuir este comando abaixo:

 

function entrar()
{
document.getElementById("conteudo").style.width = "auto";
document.getElementById("entrar").style.display = "block";
document.getElementById("cadastrar").style.display = "none";
document.getElementById("termos").style.display = "none";
document.getElementById("sobre").style.display = "none";
document.getElementById("ajuda").style.display = "none";
document.getElementById("interatividade").style.display = "none";
document.getElementById("funcionabilidades").style.display = "none";
}

 

 

envez de ficar digitando o nomes da divs que irao ficar ocultas gostaria de fazer uma especie de array aonde colocarei o nome das divs ocultas e todos ficaram em none! ok mas como faço isso?

 

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

mangakah    217

mangakah
Postado

Parece que o que você está fazendo é algo parecido com um accordion ou navegação em abas, onde você tem todos esses DIVs, mas apenas um deles é mostrado de cada vez, conforme o usuário os seleciona em um menu. Por acaso é isso?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Micilini Roll    49

Micilini Roll
Postado

sim,vou te explicar de uma melhor maneira possivel:

 

eu tenho uma aplicaçao feita em flash swf,esta aplicaçao tem 7 botoes,cada um destes botoes faz uma requisição de uma funçao javascript,ou seja se eu clicar no primeiro botao ele chama afunçao entrar:

 

function entrar()
{
document.getElementById("entrar").style.display = "block";
document.getElementById("cadastrar").style.display = "none";
document.getElementById("termos").style.display = "none";
document.getElementById("sobre").style.display = "none";
document.getElementById("ajuda").style.display = "none";
document.getElementById("interatividade").style.display = "none";
document.getElementById("funcionabilidades").style.display = "none";
}

 

obs-> incialmente todas as divs estao com display:none;

 

ai no caso quando esta funçao é chamada e altera somente a div que eu quero e coloca pra display block,e o restao fica tudo em none,dai quando chamo outra funçao ele abre outra div e oculta todas as outras MESMO ELAS ESTANDO OCULTAS!

 

 

 

MESMO ELAS ESTANDO OCULTAS....mas porque??

 

se eu abiri uma funçao e definir uma div pra display block e depois executar outra funçao ficará 2 divs em display block! entende?!

Compartilhar este post

Link para o post
Compartilhar em outros sites

mangakah    217

mangakah
Postado

Então em cada uma dessas funções tem essa repetição de getElementById... etc. É... realmente fica tosco.

 

Uma sugestão:

 

Use class para relacionar todas essas DIVs, depois pegue todas as DIVs da class (no exemplo abaixo, usei 'pagina') e aplique display 'none'. Aplicando em seguida display block apenas para a DIV selecionada, sendo o ID dela passado como parâmetro para a função mostrar().

 

 

 
<body onload="javascript:mostrar(null);">
 
<!-- no seu caso esses links estão no SWF -->
<a href="javascript:conteudo();">conteudo</a>
<a href="javascript:entrar();">entrar</a>
<a href="javascript:cadastrar();">cadastrar</a>
<a href="javascript:termos();">termos</a>
<a href="javascript:sobre();">sobre</a>
<a href="javascript:ajuda();">ajuda</a>
<a href="javascript:interatividade();">interatividade</a>
<a href="javascript:funcionabilidades();">funcionabilidades</a>
 
<div class="pagina" id="conteudo">conteudo</div>
<div class="pagina" id="entrar">entrar</div>
<div class="pagina" id="cadastrar">cadastrar</div>
<div class="pagina" id="termos">termos</div>
<div class="pagina" id="sobre">sobre</div>
<div class="pagina" id="ajuda">ajuda</div>
<div class="pagina" id="interatividade">interatividade</div>
<div class="pagina" id="funcionabilidades">funcionabilidades</div>
 
<script>
 
function mostrar(pagina) {
    var todas = document.body.getElementsByClassName('pagina');
    
    for (i = 0, len = todas.length; i < len; i++) {
        todas[i].style.display = 'none';
    }
    
    if (pagina != null) {
        document.getElementById(pagina).style.display = 'block';
    }
}
 
function conteudo() { mostrar('conteudo'); }
function entrar() { mostrar('entrar'); }


function cadastrar() { mostrar('cadastrar'); }
function termos() { mostrar('termos'); }
function ajuda() { mostrar('ajuda'); }
function interatividade() { mostrar('interatividade'); }
function funcionabilidades() { mostrar('funcionabilidades'); }

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito