Pessoal,
alguém sabe como fazer igual ao e-mail do hotmail que quando vc seleciona a checkbox referente ao e-mail e muta a cor da tabela (TR e TD).
Checkbox
Started By Fernando_Ramos, 28/11/2003, 20:00
4 replies to this topic
#1
Fernando_Ramos
-
- Usuários
-
- 728 posts
Fernando Ramos
- Sexo:Não informado
Posted 28/11/2003, 20:00
--
www.ramosinformatica.com
contato@ramosinformatica.com | @rinformatica
Hospedagem de site | Desenvolvimento de Sistemas | Informática em Geral
www.ramosinformatica.com
contato@ramosinformatica.com | @rinformatica
Hospedagem de site | Desenvolvimento de Sistemas | Informática em Geral
#2
Skuall
-
- Usuários
-
- 968 posts
Doutor
- Sexo:Não informado
Posted 29/11/2003, 13:33
Olá! 
Vamos criar a nossa tabela, com o CheckBox dentro:
Bom. Acho que os Códigos da Tabela estão certos.
Agora criamos um Simples Script!
Vamos criar a nossa tabela, com o CheckBox dentro:
<table width="50" height="20" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="cores" width="50" height="20" style="background:#003399" valign="middle" align="center">
<input type="checkbox" id="exemplo" onClick="trocarCor();">
</td>
</tr>
</table>Bom. Acho que os Códigos da Tabela estão certos.
Agora criamos um Simples Script!<script language="JavaScript">
function trocarCor() {
var exemplo = document.getElementById("exemplo").checked;
if (exemplo) {
document.getElementById("cores").style.background = "#0066CC";
}
else {
document.getElementById("cores").style.background = "#003399";
}
}
</script>
#3
Skuall
-
- Usuários
-
- 968 posts
Doutor
- Sexo:Não informado
Posted 29/11/2003, 13:35
Olá!
Vamos criar a nossa tabela, com o CheckBox dentro:
Bom. Acho que os Códigos da Tabela estão certos. Agora criamos um Simples Script!
Vamos criar a nossa tabela, com o CheckBox dentro:
<table width="50" height="20" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="cores" width="50" height="20" style="background:#003399" valign="middle" align="center">
<input type="checkbox" id="exemplo" onClick="trocarCor();">
</td>
</tr>
</table>Bom. Acho que os Códigos da Tabela estão certos.
Agora criamos um Simples Script!<script language="JavaScript">
function trocarCor() {
var exemplo = document.getElementById("exemplo").checked;
if (exemplo) {
document.getElementById("cores").style.background = "#0066CC";
}
else {
document.getElementById("cores").style.background = "#003399";
}
}
</script>
#4
Fernando_Ramos
-
- Usuários
-
- 728 posts
Fernando Ramos
- Sexo:Não informado
Posted 29/11/2003, 23:21
cara o q aconteceu foi o seguinte,ta funcionando mais quando eu coloquei uma cluna dentro da minha tabela com o mesmo id da coluna que esta o checkbox naum funcionou!! apenas a coluna aonde esta o chekbox que funcionou...segue abaixo o código::
no caso eu queria que quando eu selecionasse o checkbox ele automaticamente mudasse a cor da linha toda da tabela e nãoa apenas uma coluna aonde esta o checkbox.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript">
function trocarCor() {
var exemplo = document.getElementById("exemplo").checked;
if (exemplo) {
document.getElementById("cores").style.background = "#0066CC";
}
else {
document.getElementById("cores").style.background = "#003399";
}
}
</script>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<table width="529" height="20" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="cores" width="22" height="5" style="background:#003399" valign="middle" align="center">
<input type="checkbox" id="exemplo" onClick="trocarCor();"> </td>
<td width="507" align="center" valign="middle" id="cores" style="background:#003399"><font color="#FFFFFF">teste</font></td>
</tr>
<tr>
<td id="cores" height="5" style="background:#003399" valign="middle" align="center"><input type="checkbox" id="exemplo" onClick="trocarCor();"></td>
<td width="507" align="center" valign="middle" id="cores" style="background:#003399"><font color="#FFFFFF">teste2</font></td>
</tr>
</table>
</body>
</html>
no caso eu queria que quando eu selecionasse o checkbox ele automaticamente mudasse a cor da linha toda da tabela e nãoa apenas uma coluna aonde esta o checkbox.
--
www.ramosinformatica.com
contato@ramosinformatica.com | @rinformatica
Hospedagem de site | Desenvolvimento de Sistemas | Informática em Geral
www.ramosinformatica.com
contato@ramosinformatica.com | @rinformatica
Hospedagem de site | Desenvolvimento de Sistemas | Informática em Geral
#5
Skuall
-
- Usuários
-
- 968 posts
Doutor
- Sexo:Não informado
Posted 30/11/2003, 04:57
Olá!
Deu erro... Era óbvio Não devem existir elementos com o mesmo id em uma página...
Se quisesse mudar dois teria que colocar id's distintos e fazer uma pequena alteração no Script... Imaginemos que os id's agora são celula01 e celula02... e ainda, check01 e check02.
Então... No checkBox01 dentro da celula01 teríamos o seguinte evento onClick...
Agora ao invés de termos somente uma Simples Função, temos uma função que reage de acordo com os id's enviados no Evento onClick... Ou seja, com a mesma função você pode acionar todas as Células sem alterar o Script! Fácil não?
Deu erro... Era óbvio
Não devem existir elementos com o mesmo id em uma página...Se quisesse mudar dois teria que colocar id's distintos e fazer uma pequena alteração no Script... Imaginemos que os id's agora são celula01 e celula02... e ainda, check01 e check02.
<script language="JavaScript">
<!--
function trocarCor(celula,checkBox) {
var exemplo = document.getElementById(checkBox).checked;
if (exemplo) {
document.getElementById(celula).style.background = "#0066CC";
}
else {
document.getElementById(celula).style.background = "#003399";
}
}
</script>
Então... No checkBox01 dentro da celula01 teríamos o seguinte evento onClick...
onClick="trocarCor('celula01','checkBox01');"
Agora ao invés de termos somente uma Simples Função, temos uma função que reage de acordo com os id's enviados no Evento onClick... Ou seja, com a mesma função você pode acionar todas as Células sem alterar o Script! Fácil não?
0 user(s) are reading this topic
0 membro(s), 0 visitante(s) e 0 membros anônimo(s)
