Question

我有一个列表创建的菜单。我希望能够突出显示当前的菜单项。

使用这个脚本，我能够匹配url的最后一位（最后一个/之后的所有内容），但是我需要脚本来匹配url中的前两个文件夹。因此，而不是像index.html那样，我想抓住/folder1/folder2/index.html。

$(function () {
    var url = window.location.href.substr(window.location.href.lastIndexOf("/") + 1);
    $(".nav li a").each(function () {
        //console.log(url);
        if ($(this).attr("href") == url) $(this).parent().addClass("active");
    });
});


//Markup:

<ul id="nav">
      <li><a href="/folder1/folder2/index.html">Home</a></li>
      <li><a href="/folder1/folder2/about.html">About</a></li>
      <li><a href="/folder1/folder2/contact.html">Contact</a></li>
</ul>

如何修改脚本以匹配网址的更多部分？

Answer 1

这个应该有效：

$(function () {
  var url = window.location.href.substr(window.location.href.lastIndexOf("/") + 1);
  $('[href$="'+url+'"]').parent().addClass("active");
});

突出显示活动菜单项

1 个答案: