Javascript 在多页页面中使用jQuery设置活动链接

我知道这不是第一个问题

我试过了，但不起作用，当我点击不同的页面时，

'a'

没有激活类。任何建议，谢谢

<nav class="main-navi">
  <ul>
    <li>
      <a href="index.html">
        Home
        <span class="dot"></span>
        <span class="corner"></span>
      </a>
    </li>
    <li>
      <a href="portfolio.html">
        Portfolio
        <span class="dot"></span>
        <span class="corner"></span>
      </a>
    </li>
    <li>
      <a href="about.html">
        About
        <span class="dot"></span>
        <span class="corner"></span>
      </a>
    </li>

    <li>
      <a class="" href="service.html">
        services
        <span class="dot"></span>
        <span class="corner"></span>
      </a>
    </li>
    <li>
      <a href="blog.html">
        Blog
        <span class="dot"></span>
        <span class="corner"></span>
      </a>
    </li>
    <li>
      <a href="contact.html">
        contacts
        <span class="dot"></span>
        <span class="corner"></span>
      </a>
    </li>
  </ul>
  <em id="showHideMenu" class="show-hide-menu fa fa-bars" href="#"></em>
</nav>
<script>
  jQuery(function($){
    $('.main-navi a').filter(function(){
      return $(this).attr('href').toLowerCase() === window.location.pathname.toLowerCase();
    }).addClass('active');
  });
</script>

jQuery（函数（$）{
$（'.main navi a'）.filter（函数（）{
返回$（this.attr（'href'）.toLowerCase（）==window.location.pathname.toLowerCase（）；
}).addClass（“活动”）；
});

试试这个：

var loc = window.location.pathname;

   $('.main-navi ul li').find('a').each(function() {
     $(this).toggleClass('active', $(this).attr('href') == loc);
  });

---

并在href中使用完全绝对路径，即

http://yourdomain.com/index.html

你的问题不清楚对不起，我有6页。示例：索引页中的im。我点击about.html，然后它进入about页面。在“关于”页面中，我想让类处于活动状态。当您访问此原始页面时，是否要添加活动类？最好的方法是访问console.log（window.location.pathname）并查看它与href不匹配的原因。它可能只是有一个额外的斜杠或类似的东西。对不起，你能解释一下。因为它仍然是一个非在线的项目，非常简单，请在

href

中提供完整路径，无论它在浏览器地址栏中显示什么。这样它就可以与

window.location.pathname

匹配。谢谢您，先生，它可以工作了。我能问你点事吗。在公文包我有一个按钮，如果我点击将进入详细的公文包页面。当我加载detil portfolio页面时，如何使portfolio在navbar上激活类？