导航在 Jquery 中添加活动链接

Question

我正在使用与此问题中回答的相同的 js：https://stackoverflow.com/questions/302955/active....

我的问题是，我不想将类添加到默认链接，而是想将类添加到具有相同目录的链接。

示例：Page2 位于不同的目录中。在该页面上单击导航之外的链接。当您转到下一页时，如何在 Page2 链接上保留该活动课程？

这是导航

    <div id="nav">
              <ul>
                <li><a href="index.html">Home</a></li>
                <li><a href="test/index.html">Page2</a></li>
                <li><a href="test2/index.html">Page3</a></li>
</ul>
</div>

下面是我的 jquery。第一部分工作完美第二部分是我遇到麻烦的地方：

function markActiveLink() {var currentURL = window.location.toString().split("/");
$("#nav li a").filter(function() {
//alert(currentURL);
    return $(this).attr("href") == currentURL[currentURL.length-1];
    }).parent().addClass("current");
if($("#nav li").hasClass("current") == false) {
     alert(currentURL[currentURL.length-2]);

    }
 }

markActiveLink();

提前感谢您！

Answer 1

这应该可行。考虑到整个路径，而不仅仅是它的最后一部分。

function markActiveLink() {
    var path = location.pathname.substring(1);
    $('#nav li a[href="' + path + '"]').parent().addClass("current");
    if($("#nav li").hasClass("current") == false) {
      //whatever e.g. select default
      $('#nav li').eq(0).addClass("current");
    }
}

markActiveLink();