Discussion :

[cjacquel]

Bonjour,

Je voudrais changer la couleur de fond et du texte dans une cellule d'un tableau, quand on appuie sur un bouton de la page html. Comment faire ?

Merci,
Christophe,

[sachav]

C'est assez simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 
<script language="javascript">
function ChangeColor(ident, backgrd, texte) {
document.getElementById(ident).style.backgroundColor = backgrd;
document.getElementById(ident).style.color = texte;
}
</script>
<table border="1">
<tr>
<td id="td1">
Case 1
</td>
<td id="td2">
Case 2
</td>
</tr>
<tr>
<td id="td3">
Case 3
</td>
<td>
&nbsp;
</td>
</tr>
</table>
<input type="button" value="Case 1 en Rouge (fond) et Blanc (texte)" onclick="ChangeColor('td1', 'red', 'white')">
<input type="button" value="Case 2 en Bleu (fond) et Rouge (texte)" onclick="ChangeColor('td2', 'blue', 'red')">
<input type="button" value="Case 3 en Vert (fond) et Orange (texte)" onclick="ChangeColor('td3', 'green', 'orange')">

Suivre le meme modele pour d'autres cases.
Voici quelques couleurs disponibles :

black -> noir
chartreuse -> vert-clair
chocolate -> brun
cyan -> cyan
gray -> gris
green -> vert
red -> rouge
blue -> bleu
white -> blanc
yellow -> jaune
maroon -> marron
gold -> or

En voici d'autres :

http://www.w3schools.com/css/css_colornames.asp


Utilisation de la fonction ChangeColor :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
ChangeColor ( "Id du Td" , "Couleur de Fond", "Couleur du Texte" );