Changement de couleur d'un libellé sur OnClick

**maysa** · 28/01/2005, 21h54

Quelqu'un saurait-il comment changer la couleur d'un libellé ? (c'est pratique pour les formulaires non remplis). Je voudrai essayer avec un exemple simple qui fait que quand on clique sur le bouton le libellé change, mais comment faire avec un libellé ? en utilisant un label ?

Code :

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

1
2
3
4
5
<form name="calcul">
<label for="label1">vert</label> 
 <input type="text" name="texto" size="30" value="change la couleur du libellé">
<input type="button" value="calculer" onClick="Change()">
</form>

doit on utiliser document.form[0].label1.color pour le label ?

Merci d'avance..

**javatwister** · 28/01/2005, 22h27

salut

Code :

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

1
2
3
4
5
<form name="calcul"> 
<label for="label1">vert</label> 
 <input type="text" name="texto" size="30" value="change la couleur du libellé"> 
<input type="button" value="calculer" onClick="Change()"> 
</form>

[ton attribut "for" est-il bien utile, dans ce code...?]

en tout cas, si tu veux changer la couleur d'un texte, quel que soit le type de la balise, tu agis sur sa propriété de style correspondante:

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
 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 
<script type="text/javascript">
function val(ch){
with(document.getElementById('l'))
style.color=!ch ? '#ff0000' : '#000000';
}
</script>
 
</head>
<body>
 
<form id="f" action="">
<div>
<label id="l" for="t">entrez une valeur</label>
<input type="text" id="t" name="t" />
<input type="button" value="opération quelconque" onclick="val(document.getElementById('t').value)" />
</div>
</form>
 
</body>
</html>

si rien n'est saisi, le label se colore

**maysa** · 29/01/2005, 09h02

je pensais que le for était utile...mais au fait pourquoi with ?

Code :

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

with(document.getElementById('l'))

c'est la première fois que je vois ce mot en javascript..

En tout cas,
Merci

**javatwister** · 29/01/2005, 09h13

label est essentiellement une balise de confort:
un intitulé de champ peut très bien être donné par un span; mais la différence est que label est lié au champ dont l'id correspond à la valeurde for;
du coup, quand tu cliques sur le label, ton champ prend le focus (pratique quand tu as des difficultés pour manipuler la souris précisément);

le with précise l'objet auquel s'applique l'instruction qui suit;
ça permet d'abréger un code dans pas mal de cas, en évitant de répéter la référence complète à l'objet;
ici, c'est juste pour la facilité de lecture: sur une seule ligne, le code aurait été un peu long;