Question

如何在更改页面时将.html页面设置为活动状态？这是更改导航栏中的活动选项卡所必需的。我应该将类.current_page_item添加到导航的活动li。

我搜索了一下，但我找不到合适的答案。

Answer 1

这是你需要的jquery

   <script>
   $(document).ready(function(){

       var links = $('nav').children();
       $.each(links, function(key, value){
          if(value.href == document.URL){
           $(this).addClass('current_page_item');
          }
       });
   </script>
    <nav>
        <a href="/link1">link-1</a>
        <a href="/link2">link-2</a>
        <a href="/link3">link-3</a>
        <a href="/link4">link-4</a>
        <a href="index.html">link-5</a>
    </nav>

Link 5将获得活动类，因为它与当前url

相同

结果

<nav>
    <a href="/link1">link-1</a>
    <a href="/link2">link-2</a>
    <a href="/link3">link-3</a>
    <a href="/link4">link-4</a>
    <a class="current_page_item" href="index.html">link-5</a>
</nav>

页面处于活动状态时更改类

1 个答案:

结果