Ir para conteúdo

POWERED BY:

Arquivado

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

Bruno Cobra

Mudar classe somente de uma div

Por , em Javascript

Recommended Posts

Bruno Cobra    0

Bruno Cobra
Postado

Galera, minha dúvida é simples mas estou me quebrando para fazer.Tenho cinco divs, cada uma com um escrito-link dentro (como se fosse um simples menu, digamos). O que preciso, é que quando eu clicar em um desses links, a classe da div que contém o link clicado se altere para "clicada" e as outras permaneçam com a classe "nao_clicada". Deu para entender?Tentei declarar o id das classes num array e depois fazer através de um for, mas não funcionou.Alguém pode ajudar?Abraço

Compartilhar este post

Link para o post
Compartilhar em outros sites

Leonardo P    0

Leonardo P
Postado

isso é simples, crie um evento onclick na div passando o id dela e no js crie uma função que altera a classe. usa o getElementById(id).className = 'clicada'.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bruno Cobra    0

Bruno Cobra
Postado

Valeu pela dica, Leonardo.Mas era isso que eu quis dizer que tentei. No entanto, quando uma div for clicada, as outras devem ficar com a classe "não_clicada". Mas se outra for clicada após, esta anterior tem que novamente ficar com "nao_clicada".

Compartilhar este post

Link para o post
Compartilhar em outros sites

vagner.net    0

vagner.net
Postado

Testa esse script e adapta ao seu caso:

<script type="text/javascript">	function changeClass(e){		try{var element = e.target		  }catch(er){};		try{var element = event.srcElement  }catch(er){};				for(var i=0; i<document.getElementById('parent').childNodes.length; i++)			if(document.getElementById('parent').childNodes[i].nodeType == 1)				document.getElementById('parent').childNodes[i].className = 'naoclicada';						element.className = 'clicada';	}	window.onload = function(){				for(var i=0; i<document.getElementById('parent').childNodes.length; i++)			if(document.getElementById('parent').childNodes[i].nodeType == 1)								document.getElementById('parent').childNodes[i].onclick = changeClass;					}	</script><html>	<head>		<title>Fórum</title>		<style type="text/css">			.clicada{				background-color: #6c6c6c;				margin		  : 3px 3px 3px 3px;				width		   : 100px;			}			.naoclicada{				background-color: #ccc;				margin		  : 3px 3px 3px 3px;				width		   : 100px;			}		</style>	   	</head>	<body>			<div id="parent">			<div id="Div1" class="naoclicada">Div 1</div>			<div id="Div2" class="naoclicada">Div 2</div>			<div id="Div3" class="naoclicada">Div 3</div>			<div id="Div4" class="naoclicada">Div 4</div>			<div id="Div5" class="naoclicada">Div 5</div>		</div>	</body></html>
Você pode incluir qts DIV's precisar dentro da DIV parent. Os childNodes da DIV parent, vão herdar a função changeClass no evento Click.

 

OK..!!?? T+...

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