将类激活添加到header.php中的菜单

时间:2017-09-10 10:45:09

标签: class menu header

我正在尝试在用户访问该页面时为菜单添加class=active

我的菜单有以下代码:

<!-- main nav -->
<div class="header-nav navbar-collapse collapse">
    <ul class="nav navbar-nav">
        <li class="active"><a href="studenti.php">Acasa<i
                class="fa fa-chevron-down"></i></a>

        </li>
        <li><a href="noutati.php">Anunturi si Noutati<i
                class="fa fa-chevron-down"></i></a>

        </li>
        <li><a href="burse.php">Burse<i class="fa fa-chevron-down"></i></a>

        </li>
        <li><a href="orar.php">Orar<i class="fa fa-chevron-down"></i></a>

        </li>
        <li><a href="cazari.php">Cazari<i class="fa fa-chevron-down"></i></a>

        </li>

        <li><a href="javascript:;">Acces <i class="fa fa-chevron-down"></i></a>
            <ul class="sub-menu">
                <li><a href="#">Traiectorie scolara</a></li>
                <li><a href="#">IDFR</a></li>
            </ul>
        </li>
    </ul>
</div>

为了在访问页面时将链接菜单/页面突出显示为活动状态,我需要进行哪些设置?

我使用header.php作为全局标头配置。

2 个答案:

答案 0 :(得分:0)

您可以通过拆分网址的末尾来检测网页:

var url = window.location;
var page = url.split('/');
page = page.slice(-1).pop();

然后只检测条件,例如

if(page == 'burse.php') {
    $('.active').removeClass('active');
    $('nav li:nth-child(3)').addClass('active');
}

答案 1 :(得分:0)

我试过这个并且它正在工作

<?php
function active($currect_page){
  $url_array =  explode('/', $_SERVER['REQUEST_URI']) ;
  $url = end($url_array);  
  if($currect_page == $url){
  echo 'active'; //class name in css 
 } 
}
?>
   <div class="header-nav navbar-collapse collapse">
         <ul class="nav navbar-nav">
      <li class="class="<?php active('studenti.php');?>><a href="studenti.php">Acasa<i class="fa fa-chevron-down"></i></a>

                        </li>
                        <li class="<?php active('noutati.php');?>"> <a href="noutati.php">Anunturi si Noutati<i class="fa fa-chevron-down"></i></a>

                        </li>
                        <li class="<?php active('burse.php');?>"> <a href="burse.php">Burse<i class="fa fa-chevron-down"></i></a>

                        </li>
                        <li class="<?php active('orar.php');?>"> <a href="orar.php">Orar<i class="fa fa-chevron-down"></i></a>

                        </li>
                        <li class="<?php active('cazari.php');?>"> <a href="cazari.php">Cazari<i class="fa fa-chevron-down"></i></a>

                        </li>

感谢你的回复!