Ir para conteúdo

POWERED BY:

Arquivado

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

Lendres2

Menu que oculta e exibe divs diferentes dependendo do link clicado

Recommended Posts

Gostaria que alguém desse um help sobre como fazer um Menu (links) que oculta e exibe divs (com formulários) diferentes dependendo do link clicado, mas quando clica em um os outrso não podem ser exibidos.

 

Segue abaixo o começo do meu código.

 

<html><head><title></title><script type="text/javascript"><!--function trocar(obj){	if(obj.style.visibility == "hidden") {		obj.style.visibility="visible";	}else{		obj.style.visibility = "hidden";	}}--></script></head> <body><a href="java script:void(0);" onclick="return trocar(form_cons);">Consórcio Imobiliário</a><br /><br /><a href="java script:void(0);" onclick="return trocar(form_prevcap);">Previdência Captação</a><br /><br /><a href="java script:void(0);" onclick="return trocar(form_prevpro);">Previdência Proteção</a><br /><br /><div id="form_cons" style="visibility:hidden"><form method="post" action="">Cons<input type="text" name="texto1" /><br /><input type="text" name="texto2" /><br /><input type="button" /></form></div><div id="form_prevcap" style="visibility:hidden"><form method="post" action="">Prevcap<input type="text" name="texto1" /><br /><input type="text" name="texto2" /><br /><input type="button" /></form></div><div id="form_prevpro" style="visibility:hidden"><form method="post" action="">Prevpro<input type="text" name="texto1" /><br /><input type="text" name="texto2" /><br /><input type="button" /></form></div></body> </html>
Desde já agradeço!

Compartilhar este post


Link para o post
Compartilhar em outros sites

<html><head><title></title><script type="text/javascript"><!--function show(obj){	var objetos = document.getElementsByTagName('div');		for (var i = 0; i < objetos.length; i++)		if (objetos[i].id.indexOf('form_') >= 0)	document.getElementById(objetos[i].id).style.display = 'none';		document.getElementById(obj).style.display = 'block';}--></script></head> <body><a href="java script: void(0);" onclick="show('form_cons');">Consórcio Imobiliário</a><br><br><a href="java script: void(0);" onclick="show('form_prevcap');">Previdência Captação</a><br><br><a href="java script: void(0);" onclick="show('form_prevpro');">Previdência Proteção</a><br><br><div id="form_cons" style="display: none; background-color:#CCCCCC; width:200">	<form method="post" action="">		Cons<br>		<input type="text" name="texto1"><br>		<input type="text" name="texto2"><br>		<input type="button" VALUE="OK">	</form></div><div id="form_prevcap" style="display: none; background-color:#FFCCCC; width:200">	<form method="post" action="">		Prevcap<br>		<input type="text" name="texto1"><br>		<input type="text" name="texto2"><br>		<input type="button" VALUE="OK">	</form></div><div id="form_prevpro" style="display: none; background-color:#66CCCC; width:200">	<form method="post" action="">		Prevpro<br>		<input type="text" name="texto1"><br>		<input type="text" name="texto2"><br>		<input type="button" VALUE="OK">	</form></div></body> </html>

http://forum.imasters.com.br/public/style_emoticons/default/yay.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

o forum tá dando pau quando se escreve javascript entre [ code ] e [ /code ]... Ele coloca espaço automaticamente.

 

Tipo, é só tirar os espaços entre: href="java script:..."

Fica assim:

<a href="java script: void(0);" onclick="show('form_cons');">Consórcio Imobiliário</a><br><br><a href="java script: void(0);" onclick="show('form_prevcap');">Previdência Captação</a><br><br><a href="java script: void(0);" onclick="show('form_prevpro');">Previdência Proteção</a><br><br>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Chamem a polícia, um exorcita, os caça fantasmas!A bruxa está solta!!! hahuahauua XD

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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