Colorir Multiplas celulas de tabela atraves de checkbox
Pessoal, boa noite,
estou tentando fazer um checkbox colorir multiplas celulas de uma tabela. Ao selecionar o checkbox e clicar no onclick botao(filtrar) ou somente selecionando o checkbox, eu preciso colorir a celula de verde através de alguma propriedade. Ex: <td ID="A1" color"green" ></td> da
<!DOCTYPE html>
<html>
<body>
<script>
function obterMarcados()
{
var numeros = 0;
var listaMarcados = document.getElementsByName("checkbox1");
if (listaMarcados.length > 0)
{
for (loop = 0; loop < listaMarcados.length; loop++)
{
let item = listaMarcados[loop];
console.log(item.checked)
if (item.type == "checkbox" && item.checked)
{
numeros++;
alert(item.value);
alert(listaMarcados.length);
}
}
if (numeros == 0)
{
alert("Nenhum CheckBox foi Marcado");
}
}
else
{
alert("Nao existe nenhum CheckBox com esse nome(name)");
}
}
</script>
<form>
<table width="" border="1" cellspacing="10" cellpadding="4">
<tr align="center"> <td>--</td> <td> -- <br></td> <td>A</td> <td>B</td> <td>C</td> <td>D</td> <td>E</td> <td>F</td> <td>G</td> <td>H</td> <td>I</td> <td>J</td> <td>K</td> <td>L</td> <td>M</td> <td>N</td> <td>O</td> <td>P</td> <td>Q</td> <td>R</td> <td>S</td> <td>T</td> <td>U</td> <td>V</td> <td>X</td> </tr>
<tr align="center"> <td>--</td> <td> <input type="button" name="btn" value="Verificar Marcados" onclick="obterMarcados()"> <br></td> <td COLSPAN="12" align="center">RAIZES 8</td> <td COLSPAN="4" align="center">RAIZES 7</td> <td COLSPAN="2" align="center">RAIZES 6</td> <td td COLSPAN="3" align="center">VEREDAS 2</td> <td>CARANDÁ</td> <td>PALMAS</td> </tr>
<tr align="center"> <td>--</td> <td> -- <br></td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>7</td> <td>8</td> <td>9</td> <td>10</td> <td>11</td> <td>12</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>1</td> <td>2</td> <td>1</td> <td>2</td> <td>3</td> <td>1</td> <td>1</td> </tr>
<tr align="center"> <td>01</td> <td align="left"> <input type="checkbox" id = "3DS Max" name="checkbox1" value="3DS Max" > 3DS Max <br></td> <td bgcolor="green" id="A1">A1 </td> <td id="B1">B1</td> <td>C1</td> <td>D1</td> <td>E1</td> <td>F1</td> <td>G1</td> <td>H1</td> <td>I1</td> <td>J1</td> <td>K1</td> <td>L1</td> <td>M1</td> <td>N1</td> <td>O1</td> <td>P1</td> <td>Q1</td> <td>R1</td> <td>S1</td> <td>T1</td> <td>U1</td> <td>V1</td> <td>X1</td> </tr>
<tr align="center"> <td>02</td> <td align="left"> <input type="checkbox" id = "Adobe + Audacity" name="checkbox1" value="Adobe + Audacity" > Adobe + Audacity <br></td> <td bgcolor="white" id="A2">A2 </td> <td>B2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr>
<tr align="center"> <td>03</td> <td align="left"> <input type="checkbox" id = "Anaconda Python 5" name="checkbox1" value="Anaconda Python 5" > Anaconda Python 5 <br></td> <td bgcolor="white" id="A3">A3 </td> <td>B3</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr>
</table>
</form>
</body>
</html>Discussão (4)
Carregando comentários...