Menu actif page actuelle

Question

J'utilise Bootstrap (AdminLTE) et je veux activer l'élément de menu de la page en cours. Le problème est, je ne sais pas comment le faire. J'ai quelques solutions à l'esprit (en plus de le changer dans chaque fichier php), comme mettre une instruction IF pour chaque lien, ce qui serait une solution terrible (je pense).

 <ul class="sidebar-menu"> 
     <li class="header">HOOFD MENU</li> 
     <li class='treeview'> 
      <a href='#'> 
      <i class='fa fa-dashboard'></i> <span>Dashboard</span> 
      <span class='pull-right-container'> 
       <i class='fa fa-angle-left pull-right'></i> 
      </span> 
      </a> 
      <ul class='treeview-menu'> 
      <li><a href='account.php'><i class='fa fa-circle-o'></i>Account</a></li> 
      </ul> 
     </li> 
</ul> 

ci-dessus fait partie du menu. Par conséquent, l'élément de menu (dans ce cas Dashboard) et l'élément de sous-menu doivent tous deux être activés.

Merci d'avance!

Answer 1

Essayez ceci. Cela a été copié à partir d'un autre modèle d'admin bootstrap et modifié pour AdminLTE

<script> 
    $(document).ready(function() { 
     var url = window.location; 
     var element = $('ul.sidebar-menu a').filter(function() { 
     return this.href == url || url.href.indexOf(this.href) == 0; }).parent().addClass('active'); 
     if (element.is('li')) { 
      element.addClass('active').parent().parent('li').addClass('active') 
     } 
    }); 
    </script> 

Answer 2

Cette solution fonctionne avec le menu sous-niveau. Besoin JQuery

<script type="text/javascript"> 
    $(document).ready(function() { 
     var url = window.location; 
     var element = $('ul.sidebar-menu a').filter(function() { 
      return this.href == url || url.href.indexOf(this.href) == 0; 
     }); 
     $(element).parentsUntil('ul.sidebar-menu', 'li').addClass('active'); 
    }); 
</script> 

Answer 3

Dans une ligne simple: Autour où est-il besoin d'être placé

$("ul.sidebar-menu li a[href='"+document.location.pathname+"']").parents('li').addClass('active');