Discussion :

[nicoaix]

Bonjour,
Dans le cadre d'un menu pour un site web, j'ai plusieurs �l�ments dans ce menu.
Ce menu est constitu� par une liste (<ul><li>...</li></ul>)
Par exemple:
Accueil | Menu1 | Menu2
Ce que je souhaite c'est appliquer un style lors du clic sur un �l�ment. Pour cela j'ai une class 'item_active' qui doit s'appliquer � l'�l�ment cliqu�. Le probl�me c'est de supprimer cette classe lors du clic sur un autre �l�ment. Je souhaite donc � chaque clic supprimer la class de tous les �l�ments de ma liste (<li></li>) et l'ajouter � l'�l�ment qui a �t� cliqu�.

Comment faire pour supprimer la class 'item_active' de tous les �l�ments <li></li>?

J'ai essay� �a:

Code :

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

1
2
3
4
5
6
function apply_class(e){
	document.getElementByClassName('item_active').className = '';
	if(e.className == ''){
		e.className='item_active';
	}
}

Avec un appel � cette fonction dans chaque <li></li>:

Code :

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

<li onclick="apply_class(this)"><a href="#"><span>Accueil</span></a></li>

Ca supprime bien le style mais �a ne garde pas le style de ma classe 'item_active'.

[tusssss]

Je crois que getElementByClassName n'existe pas.

Et pourtant d'apr�s ce que tu d�cris c'est la partie qui fonctionne...

[Matthieu2000]

Code :

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

if(e.className )

?

[nicoaix]

Code :

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

if(e.className )

?

?
e.className renvoit le nom de l'�l�ment 'e' pass� en param�tre de la fonction.

//

getElementByClassName n'existe pas effectivement de mani�re native dans javascript (mais une impl�mentation de cette fonction existe).

[SpaceFrog]

il suffit d'aller voir dasn les contributions ou m�me je crois dasn le postit sur les librairies, il me semble que Le_Chomeur � post� une focntin getElementByClassName ...

[tusssss]

Le plus simple finalement resterait que tu cr�e 2 classes, cr�e une classe item inactive, et tu risques de passer les problemes de ton code, enfin rien de vraiment certain la dedans.

[nicoaix]

J'ai trouv�: Voici la fonction que j'utilise:

Code :

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

1
2
3
4
5
6
7
8
9
10
 
function apply_class(e){
//Récupération de tous les éléments (des listes) de type 'li'
	var li = document.getElementsByTagName('li');
	for(var i=0; i< li.length-1; i++){
		li[i].className = '';//Application d'un nom de classe vide à chaque élément
	}
//A la fin de la boucle:application de la classe active sur l'élément cliqué
	e.className = 'item_active';
}

Merci � tous pour votre contribution.