11499 sujets

JavaScript, DOM et API Web HTML5

Changement de couleur au clic

Bonsoir,

Je ne comprends pas pourquoi le code suivant ne fonctionne pas. Mon but est de cliquer sur une case pour changer sa couleur : si c'est blanc, ça devient noir, si c'est noir, ça devient blanc
Voici le code
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Le jeu de la vie</title>
		<link rel="stylesheet" href="style.css" />
    </head>
 
    <body>
		
		<table>
			<tr>
				<td class="morte" onclick="changeCouleur(this)"></td>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
			</tr>
			<tr>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
			</tr>
			<tr>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
			</tr>
			<tr>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
			</tr>
			<tr>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
				<td></td>
			</tr>
		</table>
		
		<script>
			function changeCouleur(td)
			{
				color = getComputedStyle(td, null).backgroundColor;
				alert(color);
				if(color=="rgb(255,255,255)")
				{
					alert(1);
					td.className='vivante';
				}
				else
				{
					alert(2);
					td.className='morte';
				}
			}
		</script>
    </body>
</html>


td
{
	border: 1px solid #cccccc;
	height:20px;
	width:20px;
}
table
{
	border-collapse:collapse;
	
}
.morte
{
	background-color:white;
}

.vivante
{
	background-color:black;
}


Merci bonne soirée
salut,
c'est parce qu'il y a un espace entre les virgules : "rgb(255, 255, 255)".
Ton code JS pourrait être beaucoup plus simple et se résumer à ça

function changeCouleur(td) {
	td.className = (td.className == "morte") ? "vivante" : "morte";
}
Ah en effet Smiley langue
J'ai copié des morceaux de code par-ci par-là sans vraiment comprendre d'où la complication.

Merciii beaucoup !
Sujet clos
Aller à