Je cherche un moyen d'afficher et de masquer des éléments de ma page selon des cliques de l'utilisateur.
Mais je ne veux absolument pas de javascript ailleurs que dans le <head> de la page, pas même d'attribut onClick dans les liens. Je sais je suis compliqué mais c'est comme ça, je pense à la maintenance avant tout.
Voici la structure de ma page :
une petite feuille de style basique :
Et j'aurais besoin d'une fonction javascript pour faire faire apparaitre les éléments suivants immédiatement les liens lorsque l'on clique sur l'un d'eux.
Pour ça j'ai commencé, dans une fonction qui s'appelle au chargement de la page, à faire la collections des seuls liens qui m'intéressaient :
Voilà déja la première ligne qui me donne des erreurs puisqu'on me préviens systématiquement que document.getElementById('page').getElementsByTagName('li').getElementsByTagName
n'est pas un fonction...
Ensuite je faisais cette boucle :
Es-ce que cette partie vous à l'air correcte ? Y aurait-il beaucoup plus simple ?
D'avance merci !
Modifié par lrbabe (30 May 2006 - 22:18)
Mais je ne veux absolument pas de javascript ailleurs que dans le <head> de la page, pas même d'attribut onClick dans les liens. Je sais je suis compliqué mais c'est comme ça, je pense à la maintenance avant tout.
Voici la structure de ma page :
<ul id="page">
<li>
<span><a href="#">Lien principal 1</a></span>
<ul>
<li>
<span><a href="#">Lien secondaire 1_1</a></span>
<div>Une div avec du texte et des liens</div>
</li>
<li>
<span><a href="#">Lien secondaire 1_2</a></span>
<div>Une div avec du texte et des liens</div>
</li>
</ul>
</li>
<li>
<span><a href="#">Lien principal 2</a></span>
<ul>
<li>
<span><a href="#">Lien secondaire 2_1</a></span>
<div>Une div avec du texte et des liens</div>
</li>
<li>
<span><a href="#">Lien secondaire 2_2</a></span>
<div>Une div avec du texte et des liens</div>
</li>
</ul>
</li>
</ul>
une petite feuille de style basique :
#page ul { display: none; }
#page div { display: none; }
Et j'aurais besoin d'une fonction javascript pour faire faire apparaitre les éléments suivants immédiatement les liens lorsque l'on clique sur l'un d'eux.
Pour ça j'ai commencé, dans une fonction qui s'appelle au chargement de la page, à faire la collections des seuls liens qui m'intéressaient :
var menulinks = document.getElementById('page').getElementsByTagName('li').getElementsByTagName('span').getElementsByTagName('a');
Voilà déja la première ligne qui me donne des erreurs puisqu'on me préviens systématiquement que document.getElementById('page').getElementsByTagName('li').getElementsByTagName
n'est pas un fonction...

Ensuite je faisais cette boucle :
for (var i = 0 ; i < menulinks.length ; ++i) {
// Au clique sur ces liens
menulinks[\i].onclick = function() { //l'anti slash avant le i ne fait pas partis du code
this.parentNode.parentNode.lastChild.style.display = 'block';
return false;
};
}
Es-ce que cette partie vous à l'air correcte ? Y aurait-il beaucoup plus simple ?
D'avance merci !
Modifié par lrbabe (30 May 2006 - 22:18)