Ir para conteúdo

POWERED BY:

Arquivado

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

zb0

Mudar cor do fundo [+radio] [+checkbox]

Por , em Javascript

Recommended Posts

zb0    0

zb0
Postado

Fala galera.

 

Tenho uma função aqui que ao clicar em uma checkbox a linha da tabela correspondente a essa checkbox muda de cor (por exemplo como no gmail). E ao desmarca-la a cor de fundo volta ao normal.

 

Agora quando uso esse mesmo código para um radiobutton, ele seta a cor de fundo, mas ao selecionar outro radio, a cor desse segundo é alterada mas a do primeiro ao invés de voltar a cor anterior ela permanece alterada.

 

ex: 2 radiobuttons

radio1

radio2

 

seto radio1 = checked

radio1 (com cor diferente)

radio2 (cor padrão)

 

seto radio2 = checked

radio1 (cor diferente)

radio2 (cor diferente)

 

o que deveria acontecer no segundo caso seria

 

seto radio2 = checked

radio1 (cor padrão)

radio2 (cor diferente)

 

Segue abaixo a função.

Vale lembrar que para checkbox ela está funcionando, quero apenas adapta-la para radiobutton.

 

ATT.

 

// Função que muda a cor da linha da tabela no momento que a checkbox dessa linha é marcada ou desmarcadafunction swapColor(oCheckbox) {	 var pop = oCheckbox, checkedcolor = '#FFFFDC';	 while (pop.nodeType != 1 || pop.nodeName.toLowerCase() != 'tr') 			pop = pop.parentNode;	 pop.style.backgroundColor = (oCheckbox.checked) ? checkedcolor : '#FFFFFF';}

Compartilhar este post

Link para o post
Compartilhar em outros sites

zb0    0

zb0
Postado

Consegui! Ficou style! hehe

Agora só preciso descobrir como fazer com que a função funcione para o caso onde existir apenas um radiobutton.

 

<!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=iso-8859-1" /><title>Untitled Document</title><script language="JavaScript" type="text/JavaScript">function setColorRadioGroup (radioGroup) { var radio = radioGroup;   if (radio[0].style) {	for (var r = 0; r < radio.length; r++) 	  if (radio[r].checked) swapColor(radio[r]);	  else swapColor(radio[r]);  }} function swapColor(oCheckbox) {	 var pop = oCheckbox, checkedcolor = '#FFFFAC';	 while (pop.nodeType != 1 || pop.nodeName.toLowerCase() != 'tr') 				 			pop = pop.parentNode;	 	 pop.style.backgroundColor = (oCheckbox.checked) ? checkedcolor : '#FFFFFF';}//--></script></head><body><form id="form1" name="form1" method="post" action="">	<table border="1">		<tr>			<td scope="row"><input name="radiobutton" type="radio" onclick="setColorRadioGroup(this.form[this.name])" value="radiobutton" /></td>			<td>radiobutton</td>		</tr>		<tr>			<td scope="row"><input name="radiobutton" type="radio" onclick="setColorRadioGroup(this.form[this.name])" value="radiobutton" /></td>			<td>radiobutton</td>		</tr>		<tr>			<td scope="row"><input name="radiobutton" type="radio" onclick="setColorRadioGroup(this.form[this.name])" value="radiobutton" /></td>			<td>radiobutton</td>		</tr>	</table></form><form id="form2" name="form2" method="post" action="">	<table border="1">		<tr>			<td scope="row"><input name="radiobutton" type="radio" onclick="setColorRadioGroup(this.form[this.name])" value="radiobutton" /></td>			<td>radiobutton</td>		</tr>	</table></form></body></html>

Testem aí!

[]'s

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