Discussion :

[yamatoshi]

Bonjour,

J'ai cr�� une fonction js qui me permet de changer la class css d'un lien.

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
 
 
Dans mon head :
function ChangeClass(id) {
 
var box= document.getElementById(id)
box.className="newclass"
 
Dans mon body
<a href="javascript:;" class="defaut" id="box1" onClick="changeClass('box1')">lien1</a>
<a href="javascript:;" class="defaut" id="box2" onClick="changeClass('box2')">lien2</a>
<a href="javascript:;" class="defaut" id="box3" onClick="changeClass('box3')">lien3</a>

Mon probl�me est que ma fonction marche bien. Lorsque je clic sur un lien il me change bien ma class mais j'aimerais que lorsque je clic sur un second lien, qu'il me remette la classe du premier lien cliqu� � d�faut et le second lien cliqu� soit bien chang�. Une id�e ?

Merci

[javatwister]

disons qu'il n'y a pas vraiment besoin de js pour changer la classe d'un lien;

et puis "Onclik" n'existe pas;

[yamatoshi]

disons qu'il n'y a pas vraiment besoin de js pour changer la classe d'un lien;

et puis "Onclik" n'existe pas;

Ah oui explique moi alors comment tu fais mister javatwister. Si tu parles de le faire en CSS �a ne joue pas pour moi car en utilisant

A:link {}
A:hover { }
A:active { }
ou
A:visited { }

�a ne r�alise pas la fonction que je souhaite. Car si j'utilise visited ben tous les liens sur lesquels j'aurais cliquer vont changer de class. Alors que moi je souhaite, si je clik sur le lien 1, il change de classe, si je clik sur un lien 2, le lien 1 revient � la classe par d�faut et le lien 2 prend la nouvelle classe. Il faut donc un javascript je pense ???

[yamatoshi]

Merci Romain je vais tester cela !

[yamatoshi]

Merci Romain mais avec ta solution il y a deux soucies :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
function ChangeClass(id) {
   var liens = document.getElementsByTagName("A");
   for (var i = 0 ; i < liens.length ; ++i) liens[i].className = ((liens[i].id = id)?"newclass":"oldclass");
}

Le premier c'est que vu que dans mon document j'ai plusieurs a href du coup il change tous de class. Ensuite lorsque je reclick sur le lien, il ne revient pas � la class par d�faut...

[yamatoshi]

Bon apr�s tout une matin�e de recherche. Voici une solution. Elle peut �tre pas optimis� mais en tous cas, elle marche

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
 
function ChangeClass(id) {
 
var liens = document.getElementsByName("link");
	 for (var i = 0 ; i < liens.length ; ++i) 
	 liens[i].className = "defaut";
 
 
var idlink=id;
var hover = document.getElementById(idlink);
		hover.className="hover"
}

Ensuite dans mon lien j'ai plac� :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
<a href="javascript:;" name="link" id="link1" class="defaut" onClick="ChangeClass('link1'"></a>
<a href="javascript:;" name="link" id="link2" class="defaut" onClick="ChangeClass('link2'"></a>
<a href="javascript:;" name="link" id="link3" class="defaut" onClick="ChangeClass('link3'"></a>

[RomainVALERI]

Le premier c'est que vu que dans mon document j'ai plusieurs a href du coup il change tous de class.

Mais tu n'avais pas pr�cis� que ton probl�me se limitait � une partie des liens de la page
Ce n'est pas grave il y a des moyens pour �viter cela.
Imaginons que l'extrait que tes liens soient contenus dans un <div> dont l'id est "liens" :

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
var liens = document.getElementById("liens").getElementsByTagName("A");

[RomainVALERI]

Mon probl�me est que ma fonction marche bien.

Merci, gr�ce � toi je viens de trouver ma "phrase du jour"

Et... � part �a : attention avec className, je crois qu'IE6 ne comprend que "class", qui est malheureusement aussi un mot r�serv� de js ... donc si tu rencontres des probl�mes, pense � essayer de remplacer

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
box.className="newclass"

par

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
// le "document.all" n'est ici qu'un exemple, c'est pour dire : "spécifique IE" ^^
if (document.all) box.setAttribute("class", "newclass");
else box.setAttribute("className", "newclass");

Enfin : pour que tes liens (non cliqu�s) redeviennent comme ils sont par d�faut, modifie un peu ta fonction changeClass :

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
 
function ChangeClass(id) {
   var liens = document.getElementsByTagName("A");
   for (var i = 0 ; i < liens.length ; ++i) liens[i].className = ((liens[i].id = id)?"newclass":"oldclass");
}

ps : attention dans ton extrait de code les accolades de ton bloc de fonction ne sont pas ferm�es... (peut-�tre une simple erreur de copier-coller ^^)