2

如果有很多页面共享同一个菜单

    include_once('common-menu.php');

但是不同页面的菜单应该有一些不同

页面 A

  <ul class="nav navbar-nav">
    <li class="active"><a href="a.php">A Page</a></li>
    <li><a href="b.php">B Page</a></li>
  </ul>

B页

  <ul class="nav navbar-nav">
    <li><a href="a.php">A Page</a></li>
    <li class="active"><a href="b.php">B Page</a></li>
  </ul>

我只知道两种解决方案。

解决方案1:服务器端检测URL然后确定输出

  <ul class="nav navbar-nav">
    <li class="<? echo 'active'; ?>"><a href="a.php">A Page</a></li>
    <li class=""><a href="b.php">B Page</a></li>
  </ul>


  <ul class="nav navbar-nav">
    <li class=""><a href="a.php">A Page</a></li>
    <li class="<? echo 'active'; ?>"><a href="b.php">B Page</a></li>
  </ul>

方案二:使用js/jquery检测url,页面加载完毕后通过js/jquery改类。

这个问题的最佳实践是什么?

是否有任何非编程解决方案,以便我不需要使用 if/case/map 来确定活动项目?

4

2 回答 2

2

有一个几乎纯 css 的解决方案,但它并不理想。将 url 输出为父 id 并使用选择器来处理其余部分。这样做的缺点是,如果您需要添加大量导航项,它会变得乏味。使用上述解决方案之一会更好。

PHP

<div id="<? basename($_SERVER['SCRIPT_NAME'], ".php") ?>">
    <ul class="nav navbar-nav">
        <li><a href="a.php">A Page</a></li>
        <li><a href="b.php">B Page</a></li>
    </ul>
</div>

CSS

#a .nav a[href$='a.php'],#b .nav a[href$='b.php']{    
    color:red;
}
于 2013-09-18T17:23:47.347 回答
1

在 PHP 方面,您可以使用内置的 PHPcurrPage()函数执行以下操作:

<li class="menu-item <?php chk_active('myprojects.php');?>"><a href="myprojects.php">Projects</a></li>
<li class="menu-item <?php chk_active('invoicehistory.php');?>"><a href="invoicehistory.php">Invoice History</a></li>

chk_active() 函数如下所示:

function chk_active($chkPage){
    if (currPage()==$chkPage) {
        echo 'active';
    }else if (currPage()=='project.php' && $chkPage=='myprojects.php'){
        echo 'active';
    }
}
于 2013-09-18T17:04:59.740 回答