javascript - 将 anchor 标记与特定的 href 相匹配

Question

我有一个带有侧边栏的仪表板，其中带有导航链接，一旦您转到链接，我就会突出显示侧面的每个链接。我通过这样做来匹配链接

$(function() {
    var item = $('.sidebar-menu a[href="' + location.href + '"]');

    item.parent().addClass('active');
});

但问题是，如果您向地址添加哈希 (#)，则它不再与链接匹配。无论如何，我希望它能够匹配。

目前它会匹配:

• mysite.com/students/companies

但它不匹配:

• mysite.com/students/companies#
• mysite.com/students/companies/subpage

我希望它匹配包含“mysite.com/students/companies”的任何内容

Answer 1

我认为你遇到了问题，因为你的 anchor 标记看起来像这样:

<a href='somethingelse.php'>Something Else</a>

我注意到你调用了父 div，所以..你用 div 或 ul、li 或其他东西包裹你的 anchor 标记..

您可以简单地添加一些额外的数据，例如“data-user=”所以<div data-user='companies'><a href='somethingelse.php'>Something Else</a></div>

现在，如果有人在公司内部或其他什么地方，就可以这样做:

var url_string = window.location.href;
var url = url_string.split('/')
var item = $('div[data-user='+url[3]+']).addClass('active');

这适用于如下所示的网页:www.some.com/companies和www.some.com/companies/sometihng甚至www.some.com/companies/sometihng/more