Désactiver un lien href

Version imprimable

25/12/2010, 15h49
skandaboy

Désactiver un lien href

bonjour,

pouvez me dire comment faire pour désactiver un lien href quand l'utilisateur est sur la page du lien en question.
comme sur ce site :http://leandrovieira.com/projects/jquery/lightbox/

Merci
25/12/2010, 17h41
RomainVALERI

Il y a plusieurs moyens , tout dépend de l'architecture de tes pages et de ton mode de navigation.

Si ce sont réellement des pages différentes, le problème n'existe pas : tu peux désactiver le lien "en dur" sur sa propre page. Mais si tu poses la question, j'imagine que ce n'est pas ton cas. ^^

Si en revanche toutes tes "pages" sont en fait des div tous présents sur la même page html, avec un système "afficher l'un, masquer les autres", c'est dans ta fonction de navigation qu'il faudra placer une ligne pour désactiver le lien cliqué.

Si tu veux un avis plus précis ou que tu as du mal à l'appliquer à ton contexte : donne-nous un lien ou un extrait de code.

J'ai plusieurs pages différentes avec des liens href. Je crois qu'il faut utiliser la fonction getElementById() masi je viens juste de commencer le JS donc je ne sais pas bien l'utiliser.

J'ai ça par exemple dans ma page index. Si je clique sur l'index.html j'aimerais que le lien href correspondant ne sois plus cliquable (qu'il n'y ait pas le doigt) quand on passe la souris dessus.
Dans ma balise body j'ai mis un attribut onload et j'appelle ma fonction javascript au chargement de la page. mais ça ne marche pas.Je ne sais pas si c'est la bonne propriété que j'utilise ou autre. Comment faire?
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 <script type="text/javascript" language="javascript"> function disableStyle(){ document.getElementById("lien1").disabled = true; } </script> </head> <body onload="disableStyle()"> <div id="en_tete"> <img src="../images/mini21462.jpg" alt="miniature1" />  <img src="../images/enb.jpg" alt="miniature2" /> </div> <div id="menu"> <a href="../index.html" id="lien1" class="couleur">Présentation</a> <a href="siteEB/page2.html" class="couleur">Bibliographie</a> <a href="pagephoto.html" class="couleur">Galerie</a> <a href="siteEB/page3.html" class="couleur">Films</a> </div> <div id="corps">

Heu... là si je ne m'abuse, on est dans le premier des deux cas de figure que j'évoquais ^^ le plus "facile" en l'occurrence...

Question : Pourquoi essayer de défaire en JS ce que tu viens de faire en HTML... ? :roll:

Solution : Tu n'as pas besoin d'une fonction Javascript ici, remplace ceci dans ton HTML (en suivant le même principe pour les autres pages) :
Code:

1 2 3 4 5 6 <div id="menu"> <span>Présentation</span> <a href="siteEB/page2.html" class="couleur">Bibliographie</a> <a href="pagephoto.html" class="couleur">Galerie</a> <a href="siteEB/page3.html" class="couleur">Films</a> </div>
...en ajoutant éventuellement un id et une classe à l'élément selon les traitements JS qui sont censés devoir pointer sur lui (là, c'est à toi de nous dire ^^) (et si, en dernier recours, tu avais quand même besoin que cet élément soit un lien, pour des raisons liées soit au JS soit au CSS, il faudra envisager un gestionnaire onclick, ce n'est pas méchant :
Code:

1 2 3 document.getElementById("lien1").onclick = function() { return false; }
(une fois que la page est chargée)

26/12/2010, 14h59
skandaboy

@Romain Valéri.

Merci pour ton aide.

J'ai fait la 1ère solution et ça marche très bien avec un peu de CSS mais
je voulais voir le javascript.

J'ai juste un pb avec le getElementByID() il ne me récupère pas l'élément href indiqué par l'ID. j'ai fait un test avec une boite alert() et elle m'indique que le contenu est égal à null.

Peut être que je ne place pas l'appelle de la fonction au bon endroit (après le chargement de la page comme tu dis) je vais essayer ça parce que sinon je ne vois vraiment pas ou est le pb.