如何保持我的当前页面菜单在分页上突出显示？

Question

我在页面中有一个导航菜单，通过添加一个类来基于URL来突出显示当前菜单。

我的问题是，我的页面进行分页，所以有时用户会在结束：

http://example.com:4001/wordpress/calientes/page/2/， /页/ 3 /，/页/ 4 /等等...

当用户浏览页面时，什么是保持菜单高亮度的最佳方式？

这是我的菜单：

<div class="innerhead"> 

<ul> 

<li> <a href="http://example.com:4001/wordpress/calientes/">Calientes </a> </li> 
<li><a href="http://example.com:4001/wordpress/tendencias/">Tendencias</a></li> 

</ul> 

</div> 

这是脚本，我用它来突出显示当前页面菜单：

<script> 
$(function(){ 
    // this will get the full URL at the address bar 
    var url = window.location.href; 

    // passes on every "a" tag 
    $(".innerhead a").each(function() { 
      // checks if its the same on the address bar 
     if(url == (this.href)) { 
      $(this).closest("li").addClass("active"); 
     } 
    }); 
}); 
</script> 

Answer 1

另一种选择可能是：

<div class="innerhead"> 
    <ul> 
    <li id="calientes"> <a href="http://example.com:4001/wordpress/calientes/">Calientes </a> </li> 
    <li id="tendencias"> <a href="http://example.com:4001/wordpress/tendencias/">Tendencias</a></li> 
    </ul> 
</div> 

在您的脚本中：

var url = window.location.pathname.split('/'); 
$('#'+url[4]).addClass("active");