[Resolvido] Ocultar / Exibir Formulário
Bom dia a todos.
Primeiro eu gostaria de dizer que sou iniciante nesta parte de web e ainda estou dando os meus primeiros passos em JavaScript e CSS.
Eu pesquisei aqui no forum sobre o assunto mas não achei nenhum post que me ajudase a descobrir o porque o meu exemplo não funciona.
Eu desenvolvi um código a onde tenho dois formulários, que inicialmente ficam ocultos, e dois links a onde a idéia é a seguinte:
Ao clicar no link 1, o formulário 1 aparece e faz o formulário 2 se ocultar.
Ao clicar no link 2, o formulário 2 aparece e faz o formulário 1 se ocultar.
O código até "funciona" mas, após executar o script que oculta um dos formulários e exibe o outro, ele volta ao estado inicial a onde ambos os formulários ficam ocultos.
Será que alguém pode me ajudar a identificar o meu erro ?
Obrigado.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<div id="idMenuEsquerdo" style="float:left">
<a href="" id="idLink1" onclick="ufExibirOcultar(this);">Link 1</a> <br/>
<a href="" id="idLink2" onclick="ufExibirOcultar(this);">Link 2</a> <br/>
</div>
<div id="idCorpo" style="float:left">
<div id="idCampo1" style="display:none">Campo1</div>
<div id="idCampo2" style="display:none">Campo2</div>
</div>
<script>
function ufExibirOcultar(objElemento)
{
if(objElemento.id == "idLink1")
{
document.getElementById("idCampo1").style.display = "block";
document.getElementById("idCampo2").style.display = "none";
}
else
{
document.getElementById("idCampo1").style.display = "none";
document.getElementById("idCampo2").style.display = "block";
}
}
</script>
</body>
</html>Discussão (5)
Carregando comentários...