Impossible de changer la couleur du text en javascript

**zozotitou** · 12/10/2015, 08h58

Bonjour à tous,

J'ai une page web et un script JS, et je voudrai changer la couleur du texte qui change quand je clique desus.

j'ai 2 texte :
Allumé, je vous qui passe en vert.
Éteint, je veux qui passe en rouge.

Je les 2 fichiers : ci-joint

Merci de votre aide.

**SpaceFrog** · 12/10/2015, 09h19

il tes suffit soit de modifier le .style.color ou d'avoir deux class css, un poru chaque état, d'attribuer un class css lors du click ...
c'est pas dans la FAQ ça ?

**zozotitou** · 12/10/2015, 09h24

Merci pour, mais je ne sais pas comment le mettre, j'ai récupérer le JS d'un collègue mais je suis débutant en JS. Ou je peux trouver ces informations.
Merci de ton aide
cdlt

**SpaceFrog** · 12/10/2015, 09h46

http://fiddle.jshell.net/de66ka4r/

**zozotitou** · 12/10/2015, 10h05

Merci pour ton exemple, mais je n'arrive pas à change texte, on change que la couleur
merci de ton aide !!!Je l'ai intégré dans JS , il ne change pas me couleur ?????????????????

**SpaceFrog** · 12/10/2015, 10h14

Pour le texte c'est le innerHTML ..
https://jsfiddle.net/de66ka4r/3/

**zozotitou** · 12/10/2015, 10h31

Merci j'ai réussi mais je dois mettre à chaque fois les script pour chaque en changeant le id, il n'y a pas de mettre un script générique (ou le mettre dans fichier JS) pour faire le changement pour chaque commande,

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
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
 
<!DOCTYPE html>
<html lang="fr">
	<head>
		<title>Gestion des lumières extérieures</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<meta name="robots" content="noindex" />
		<!--<script src="test1.js" type="text/javascript"></script>-->
		<script>
		document.getElementById('foo').onclick= function(){
			var on=getComputedStyle(this, null).color=="rgb(255, 0, 0)";
			this.style.color=on?"green":"red";
			this.innerHTML=on?"Allumé":"Éteint";
		};
		</script>
	</head>
 
	<body bgcolor="#FFFFFF">
		<h1>Gestion des lumières extérieures</h1>
 
		<table width="180" border="1" cellspacing="0" cellpadding="4" bordercolor="#000000">
			<tr> 
				<td>Allée</td>
				<!--<td></td>-->
				<td>
					<center>
						<strong> 
							<div   id="foo" class="off">On</div>
							<script>
								document.getElementById('foo').onclick= function(){
									var on=getComputedStyle(this, null).color=="rgb(255, 0, 0)";
									this.style.color=on?"green":"red";
									this.innerHTML=on?"Allumé":"Éteint";
								};
							</script>
						</strong> 
					  </center>
				</td>
			</tr>
			<tr> 
				<td>Porche</td>
				<!--<td></td>-->
				<td>
					<center>
						<strong> 
							<div   id="foo1" class="off">On</div>
							<script>
								document.getElementById('foo1').onclick= function(){
									var on=getComputedStyle(this, null).color=="rgb(255, 0, 0)";
									this.style.color=on?"green":"red";
									this.innerHTML=on?"Allumé":"Éteint";
								};
							</script>
						</strong> 
					  </center>
				</td>
			</tr>
 
		</table>
	</body>
</html>

Je mets le code HTML.
Peux-tu vois merci
Cdlt

**SpaceFrog** · 12/10/2015, 10h45

Jquery te simplifierait la tache ...

**zozotitou** · 12/10/2015, 10h53

Je n'ai aucune connaissance de JQUERY.
Et de plus j'ai besoin de 3 positions sur certaines commandes .
cdlt

**SpaceFrog** · 12/10/2015, 11h26

Jquery = javascript ...

sinon pour factoriser tes attributions de click il suffit de faire une fonction sur le onload
https://jsfiddle.net/de66ka4r/4/

ensuite si tu as différents états pour chaque élément, tu pourrais les stocker les différents texte et couleurs au niveau même de l'élément dans des attributs data

**zozotitou** · 12/10/2015, 11h27

Merci je regarde et je te tiens au courant
Cdlt

Impossible de changer la couleur du text en javascript

JavaScript

Discussions similaires

Partager

Partager