Question

我在我的网站上使用bootstrap分页菜单从一个页面导航到另一个页面。

我从以下位置复制了分页菜单：

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_pagination_active&stacked=h 并将其添加到我网站的所有页面。

它工作正常，我可以使用以下方式设置活动状态：

  <li class="active">
 <a href="pages/1.php">1</a></li>

根据代码所在的页面链接。

由于某些原因，我想只有一个菜单文件并将其包含在所有页面中。

有没有办法自动将“.active”类添加到包含菜单中的链接？

menu.php

<ul class="pagination">
<li><a href="pages/1.php">1</a></li>
<li><a href="pages"pages/2.php">2</a></li>
<li><a href="pages/3.php">3</a></li>
<li><a href="pages/4.php">4</a></li>
</ul>

请帮忙！

Answer 1

您可以根据您的设置进行操作。在javascript中，以jQuery为例：

var currentPage = 2; //say the page is defined like this
$('.pagination li').eq((currentPage-1)).addClass('active');

如果您生成页面服务器端，例如在PHP

中

$currentPage = 2;
$output = '<ul class="pagination">';
//iterating pages
if($pageNum == $currentPage){
   $output .= <li><a class="active" href="pages/'+$pageNum+'.php">'+$pageNum+'</a></li>
} else {
   $output .= '<li><a href="pages/'+$pageNum+'.php">'+$pageNum+'</a></li>';
}
$output .= '</ul>'
echo $output;

在不同页面上更改菜单活动状态

1 个答案: