sélectionner le lien actuel

Question

Comment puis-je sélectionner le lien actuel via jquery si j'ai une div comme celle-ci :

<div id='navigation'>
  <a href='users/home'>home</a> |
  <a href='projects/browse'>home</a>
  <a href='discussions/browse'>home</a>
  <a href='search/dosearch'>home</a>
</div>

Note J'ai essayé :

$(document).ready(function(){
    $("#navigation a").click( function(event)
    {
       var clicked = $(this); // jQuery wrapper for clicked element
       // ... click-specific code goes here ...
       clicked.addClass('selected');
    });
});

Mais quand je clique sur un lien, il sélectionne un lien et ajoute la classe .selected mais il recharge la page pour naviguer vers une page et ensuite tout disparaît. Comment faire ?

Remerciements

Answer 1

Cela devrait fonctionner :

$(document).ready(function() {
    var loc = window.location.href; // The URL of the page we're looking at
    $('#navigation a').each(function() {
        if (loc.indexOf(this.href) !== -1) { // If the URL contains the href of the anchor
            $(this).addClass('selected'); // Mark it as selected
        }
    });
});

Il passe en revue les éléments de navigation et, si l'URL de la page actuelle contient l'href de l'ancre, il ajoute la classe selected à l'ancre.

Answer 2

Oui, prenez l'événement de votre click() et utiliser les arguments du callback e.preventDefault(); (voir là ).

Ou return false .

Ou ajouter un target='_blank' à vos liens pour qu'ils ouvrent le lien dans une autre page ou un autre onglet, si vous voulez toujours que le lien soit ouvert par le navigateur quelque part.

Answer 3

$(document).ready(function(){
    $("#navigation a").click( function(event)
    {
       var clicked = $(this); // jQuery wrapper for clicked element
       // ... click-specific code goes here ...
       clicked.addClass('selected');
       return false;
    });
});

N'oubliez pas de return false ¡!