Ir para conteúdo

POWERED BY:

Arquivado

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

prog_web

Destacar linha de tabela

Por , em Javascript

Recommended Posts

prog_web    0

prog_web
Postado

Estou criando uma tabela e quero destacar uma linha dela aplicando uma cor de fundo de fierente quando ela for clicada.

 

Tenho tentado o seguinte (nessa mesma tabela eu zebro as linhas dela):

 

<table><tr onmouseover="this.bgColor='#BCD0DA'" onmouseout="this.bgColor='#FFFFFF'" onclick="this.bgColor='#8EAEBF'" bgcolor="#FFFFFF"><td width="30" valign="top" align="center">x</td><td width="610" valign="top">y</td></tr><tr onmouseover="this.bgColor='#BCD0DA'" onmouseout="this.bgColor='#E6EAEE'" onclick="this.bgColor='#8EAEBF'" bgcolor="#E6EAEE"><td width="30" valign="top" align="center">x</td><td width="610" valign="top">y</td></tr></table>

Tentei usar o onclick e de certa forma funciona. Eu clico na linha e ela recebe o valor indicado no onclick mas quando o mouse sai dela volta a ficar com a cor normal da "zebra". Eu só não posso remover o onmouseover e out porque com eles eu faço essa "zebra" na tabela. O que eu poderia fazer para resolver isso?

Compartilhar este post

Link para o post
Compartilhar em outros sites

prog_web    0

prog_web
Postado

Isso é Javascript. Não Webstandards.Movido.

Desculpa, eu havia postado na seção errada. Quando vi, já era...Vagner, fiz como sugerido porém o onfocus e onblur não estão funcionando na linha:
<table><tr onfocus="this.bgColor='#BCD0DA'" onblur="this.bgColor='#FFFFFF'" onclick="this.bgColor='#8EAEBF'" bgcolor="#FFFFFF"><td width="30" valign="top" align="center">x</td><td width="610" valign="top">y</td></tr><tr onfocus="this.bgColor='#BCD0DA'" onblur="this.bgColor='#E6EAEE'" onclick="this.bgColor='#8EAEBF'" bgcolor="#E6EAEE"><td width="30" valign="top" align="center">x</td><td width="610" valign="top">y</td></tr></table>
O que estaria errado?Outra coisa, ao clicar na linha uma vez, ela marcaria (ok - agora esta funcionando), mas eu queria se clicar de novo desmarcar a linha. Só mesmo fazendo uma função para isso, né?

Compartilhar este post

Link para o post
Compartilhar em outros sites

vagner.net    0

vagner.net
Postado

Faz uma função e verifica a cor atual da linha, e troca pela outra.Isso deve ser tranquilo pra você tb...PS: Não tinha associado que você está executando eventos de uma <TR>.

Compartilhar este post

Link para o post
Compartilhar em outros sites

filipescoob    1

filipescoob
Postado

Pronto cara acabei de montar uma funçãozinha pra você usar aqui coisa rapida, qualquer erro da um toque ok abraços

Não sei se era esta sua ideia mas perdi 5 min aqui e montei isso pra ti cara boa sorte.

 

abraços

 

qualquer coisa posta ai.

 

 

<HTML><HEAD><META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0"><TITLE></TITLE><script>var cor1 = '#BCD0DA'var cor2 = '#E6EAEE'var cor3 = '#8EAEBF'var zebra = '#FFFFFF'var j = 0var anteriorfunction mudaCor(elem,acao,atual) {		if (acao == "over") {			elem.bgColor = zebra		}		if (acao == "out") {			elem.bgColor = anterior		}		if (acao == "click") {			clicknum = 1			elem.bgColor = cor3			atual = cor3		}	anterior = atual}function carrega() {elem = document.getElementsByTagName("tr");	for(i=0;i<elem.length;i++){		if (j==0) {			elem[i].bgColor = cor1			j=1		} else {			elem[i].bgColor = cor2			j=0		}  }	}</script></HEAD><BODY onload="carrega()"><table>	<tr onmouseover="mudaCor(this,'over',this.bgColor);" onmouseout="mudaCor(this,'out',this.bgColor);" onclick="mudaCor(this,'click',this.bgColor);">		<td width="30" valign="top" align="center">x</td>		<td width="610" valign="top">y</td>	</tr>	<tr onmouseover="mudaCor(this,'over',this.bgColor);" onmouseout="mudaCor(this,'out',this.bgColor);" onclick="mudaCor(this,'click',this.bgColor);">		<td width="30" valign="top" align="center">x</td>		<td width="610" valign="top">y</td>	</tr></table></BODY></HTML>

Ai esta tudo parametrizado o bom é que estiver usando alguma linguagem dinamica é só adapitar.

Compartilhar este post

Link para o post
Compartilhar em outros sites

prog_web    0

prog_web
Postado

filipescoob, legal! Só esta tendo o mesmo problema que eu relatei no meu último post: uma vez que você clica na linha e a marca, depois que se clica nela de novo ela não esta ficando desmarcada.

Compartilhar este post

Link para o post
Compartilhar em outros sites

filipescoob    1

filipescoob
Postado

O problema será descobrir qual a zebra da tabela que ela tinha antes de ser alterada.

Compartilhar este post

Link para o post
Compartilhar em outros sites

prog_web    0

prog_web
Postado

Você vai poder clicar em apenas uma por vez ou em duas ou mais?

A idéia seria marcar quantas fossem clicadas... Agarrei nisso também...

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