Récupérer puis changer une Class

Invité · 07/05/2013, 21h25

Bonjour,

Je voudrais récupérer pour la sauvegarder la class d'un objet.
seulement cet objet je ne sais fabriquer son ID que par une concaténation
d'un nombre et un texte comme ceci

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
Lanchold=12:
CleTxt="X"+Lanchold;
change_class(CleTxt);
 
/* ==============et plus loin j'ais================ */
function change_class(Lui) 
 { 
   leold = document.getElementById(Lui); 
   agarder=leold.className;
   // ==pour garder la class que je veux remettre ensuite
   leold.className="uneclasseprovisoire" ; 
 }

Cela semble ne pas marcher

voyez vous mon erreur, merci d'avance.

**Auteur** · 07/05/2013, 21h34

Bonsoir,

est-ce que tu appelles la fonction après le chargement complet de la page ?
Comme tu le présentes, je n'en ai pas l'impression :

Code :

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

1
2
3
Lanchold=12:
CleTxt="X"+Lanchold;
change_class(CleTxt);

Si tu appelles cette fonction avant le chargement complet de la page, l'objet avec l'id que tu as défini n'existe pas.

N'oublie pas aussi de déclarer systématiquement tes variables.

Invité · 07/05/2013, 21h53

Merci à toi l'Ami.

Oui, de coté là, c'est parfait, car tout le javascript ne peut être activé qu'a une première action du visiteur.
Par ailleurs je ne l'avais pas mis ici mais mes variables sont initialisées par varxxx Etc...

Merci pour cette vigilance.

**Auteur** · 08/05/2013, 12h49

Peut-on avoir plus de code ?

Invité · 08/05/2013, 13h01

Bonjour l'Ami,
En fait le premier code se suffit a lui même et il est complet,
il devrait mettre dans "agarder" le nom de la class ??
par exemple si je fais un alert (agarder); il devrait m'afficher petitefonte
si c'est son contenu !

Et prendre la nouvelle classe par exemple grossefonte !

**SylvainPV** · 08/05/2013, 13h21

Ca on l'a bien compris mais s'il ne fonctionne pas, c'est que le problème est ailleurs. Etes-vous sûre que l'élément avec l'ID désiré est bien présent lorsque vous appelez cette fonction ? Utilisez le debugger Javascript de votre navigateur ou console.log(leold) pour vous en assurer.

Invité · 08/05/2013, 14h25

Whaou mille mercis a vous deux, vous aviez raison
grâce a vous un code qui marche 100% (testez

)

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
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META content="text/html; charset=windows-1252" http-equiv=Content-Type>
<META name=GENERATOR content="MSHTML 8.00.6001.19190">
<STYLE>
.title1 { font-family : "Felix Titling", "Times New Roman", Harrington, sans-serif; font-size : 3em; color : #aaaaaa; } 
.title2 { font-family : "Times New Roman", Harrington, sans-serif; font-size : 2em; color : #aa1111; } 
</STYLE>
<script type='text/javascript'>
var leold='';
var agarder='';
function lance(x)
 {
 var lid='aa'+x;
 change_class(lid); 
 }
function change_class(Lui) 
 {
   leold = document.getElementById(Lui); 
   agarder=leold.className;
   if(agarder=='title1') agarder='title2';
    else agarder='title1';
   leold.className=agarder ; 
 }
 
</script>
</HEAD>
<BODY bgColor=#ffffff>
<DIV>
<span class='title1' id='aa1'>Sylvie Testud en « Tchad inconnu »</span>
<br /><span class='title2' id='aa2'>Sylvie Testud en « Tchad inconnu »</span>
 
<br />
<form name="LeForm" action="#">
<input type="button" value="Change1" onclick="lance(1);"><br />
<input type="button" value="Change2" onclick="lance(2);">
</form>
</DIV>
</form>
 
</DIV></BODY></HTML>

Encore merci

**SylvainPV** · 10/05/2013, 17h41

Voilà une autre façon plus "propre" pour arriver au même résultat :
http://jsfiddle.net/TC842/

Sinon, pouvez-vous cliquer sur Résolu ? Merci

Récupérer puis changer une Class

JavaScript

Discussions similaires

Partager

Partager