Comment ajouter une classe active dans un niveau de menu à trois niveaux où l'attribut href a le même passage

Question

J'ai trois niveaux de sous-menu créés dynamiquement. Je veux ajouter class = "active" où le texte a la même URL.

Un espace et une virgule seront remplacés par un score inférieur.

Par exemple, le verre, plast, Gummi de la page porselen sera

http://www.mywebsite.com/folder/Glass_plast_gummi_og_porselen.asp 

Chaque attribut href a le même chemin que dans l'URL

HTML

<ul id="submenu"> 
     <ul><li><a href="Grunnskole.asp" title="" class="">Grunnskole</a> 


      <ul><li><a href="Forskerspiren.asp" title="" class="">Forskerspiren</a> 


      <ul><li><a href="Sikkerhet.asp" title="" class="">Sikkerhet</a> 


      </li><li><a href="Laboratorieutstyr(1).asp" title="" class="">Laboratorieutstyr</a> 


      </li><li><a href="Glass_plast_gummi_og_porselen.asp" title="" class="">Glass, plast, gummi og porselen</a> 


      </li><li><a href="Datalogging.asp" title="" class="">Datalogging</a> 


      </li></ul></li><li><a href="Mangfold_in_naturen.asp" title="" class="">Mangfold in naturen</a> 


      </li><li><a href="Kropp_og_helse.asp" title="" class="">Kropp og helse</a> 


      </li><li><a href="Verdensrommet.asp" title="" class="">Verdensrommet</a> 


      </li><li><a href="Fenomener_og_stoffer.asp" title="" class="">Fenomener og stoffer</a> 


      </li></ul></li><li><a href="Sikkerhet_og_inventar(1).asp" title="" class="">Sikkerhet og inventar</a> 


      </li><li><a href="Laboratorieutstyr.asp" title="" class="">Laboratorieutstyr</a> 


      </li></ul> 

    </ul> 

Je te remercie en avance.

Answer 1

Vous pouvez utiliser window.location.pathname pour obtenir juste le nom de fichier, puis utilisez l'attribut-end avec ou attributs égaux sélecteurs:

// Get the current file name from window.location.pathname 
var file = window.location.pathname.split("/").pop(); 

// Look for <a> elements whose `href` matches the file 
$("#submenu a[href$='"+file+"']").addClass("active"); 

En utilisant cette méthode, vous n'avez pas ambiguïté qui vient de 2 caractères étant remplacés par un trait de soulignement.

Answer 2

Cela fonctionne: http://www.jsfiddle.net/BBvLN/. La façon dont vous nettoyez l'URL n'est pas correcte. En outre, vous voulez faire correspondre le href de l'étiquette, pas le texte contenu dans l'étiquette.

var url = "http://www.mywebsite.com/folder/Glass_plast_gummi_og_porselen.asp"; 
var slug = url.replace('http://www.mywebsite.com/folder/',''); 

$("#submenu a[href=" + slug + "]").addClass("active");