Appelez la fonction JQuery après le lien vers une page

Pour ma barre de navigation, je l'ai de sorte que lorsque je clique sur l'un des éléments, ma classe css "current-menu-item" est activée. Cela fonctionne dans une certaine mesure. Mon code Jquery est la suivante:Appelez la fonction JQuery après le lien vers une page

$(document).ready(function(){ 
    $("li.menu").click(function(){ 
    $("li.menu").removeClass("current-menu-item"); 
    $(this).addClass("current-menu-item"); 
    }); 
});

Ce sont les rails LINK_TO:

<li class="menu"> 
    <%= link_to "home", root_url %> 
</li>

Le seul problème est que ce code est exécuté avant la redirection. Donc, je ne peux que voir rapidement la classe s'activer pendant une courte seconde avant que la nouvelle page se charge et qu'elle soit supprimée.

Quelle est la meilleure façon de résoudre ce dilemme?

Source

2013-06-21 Vasseurth

C'est ce que nous appelons le comportement par défaut ... –

Utilisez votre code serveur pour placer la classe sur le bon li, en fonction de ce qui a été cliqué. C'est vraiment la seule façon de le faire, car techniquement, ils peuvent se rappeler/enregistrer l'URL du lien, le visiter plus tard, et ils ne verront pas la bonne chose (si vous avez essayé d'utiliser une technologie client comme cookies ou 'localStorage '). En même temps, vous pouvez laisser le JavaScript déterminer la page sur laquelle ils sont actuellement (en examinant 'window.location.href', ou' window.location.pathname') mais je pense que c'est compliqué et moins maintenable. – Ian

Si vous allez faire cela avec JavaScript, et non sur le serveur, vous pouvez comparer window.location.pathname à l'attribut href de vos liens de menu.

Quelque chose comme ceci:

$.each("li.menu", function(i, menuItem) { 
    if (menuItem.attr("href") === window.location.pathname) { 
    menuItem.addClass("current-menu-item"); 
    } 
});

Gardez à l'esprit que cela ne fonctionnera pas à moins que votre nom de chemin correspond exactement à l'attribut href, il est donc sujette à l'erreur.

Source

2013-06-21 20:57:53 zakangelle

Appelez la fonction JQuery après le lien vers une page

Répondre

Questions connexes