Question

我知道这不是第一个问题。

我尝试从jQuery Make a Link in Active Status开始，但是它不起作用，当我点击进入不同页面时，'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>

Answer 1

试试这个：

var loc = window.location.pathname;

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

并在href中使用完整的绝对路径，即{。{1}}

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

1 个答案: