jQuery добавить класс .active в меню - PullRequest
33 голосов
/ 01 февраля 2011

У меня проблема.

Я хочу добавить класс «активный» в меню пунктов, когда соответствующая страница включена.

меню очень простое:

<div class="menu">

<ul>
<li><a href="~/link1/">LINK 1</a>
<li><a href="~/link2/">LINK 2</a>
<li><a href="~/link3/">LINK 3</a>
</ul>

</div>

В jQuery мне нужно проверить, если URL-адрес www.xyz.com/other/link1/

если это то, что я хотел бы добавить один класс, элемент 'a' ссылки1.

Я пробую много решений, но ничего не получается.

Ответы [ 14 ]

0 голосов
/ 17 сентября 2016
$(function() {
     var pgurl = window.location.href.substr(window.location.href.lastIndexOf("/")+1);
     $(".nav li").each(function(){
          if($('a',this).attr("href") == pgurl || $('a', this).attr("href") == '' )
          $(this).addClass("active");
     })
});
0 голосов
/ 31 октября 2015
<script type="text/javascript">
    jQuery(document).ready(function($) {
    var url = window.location.pathname,
urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); 
    $("#navbar li a").each(function() {//alert('dsfgsdgfd');
    if(urlRegExp.test(this.href.replace(/\/$/,''))){
    $(this).addClass("active");}
});
}); 
</script>
0 голосов
/ 05 апреля 2015

эта работа для меня: D

    function setActive() {
      aObj = document.getElementById('menu').getElementsByTagName('a');
      for(i=0;i<aObj.length;i++) {
        if(document.location.href.indexOf(aObj[i].href)>=0) {
          var activeurl = window.location;
          $('a[href="'+activeurl+'"]').parent('li').addClass('active');
        }
      }
    }

    window.onload = setActive;
0 голосов
/ 05 июля 2013

Устанавливая активное меню, у них есть много способов сделать это. Теперь я поделюсь с вами способом установить активное меню с помощью CSS.

    <a href="index.php?id=home">Home</a>
    <a href="index.php?id=news">News</a>
    <a href="index.php?id=about">About</a>

Теперь, вы только установите $_request["id"] == "home" thì echo "class='active'", тогда мы можем сделать то же самое с другими.

<a href="index.php?id=home" <?php if($_REQUEST["id"]=="home"){echo "class='active'";}?>>Home</a>
<a href="index.php?id=news" <?php if($_REQUEST["id"]=="news"){echo "class='active'";}?>>News</a>
<a href="index.php?id=about" <?php if($_REQUEST["id"]=="about"){echo "class='active'";}?>>About</a>

Я думаю, это полезно с тобой.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...