Question

我需要高亮显示当前类别。我可以这样做，没问题：

的javascript

var url = document.URL;
$('.nav a[href="'+url+'"]').addClass('active');

HTML

<div class="nav">
    <ul>
        <li><a href="http://wholewebaddress.com/cat.php?id=1">Category 1</a></li>
        <li><a href="http://wholewebaddress.com/cat.php?id=2">Category 2</a></li>
    </ul>
</div>

但我不想在html代码中链接到http://wholewebadress.com/catphp?cat.php?id=1，而是想要链接到cat.php?id=1。所以我希望我的html代码如下所示;

<div class="nav">
        <ul>
            <li><a href="cat.php?id=1">Category 1</a></li>
            <li><a href="cat.php?id=2">Category 2</a></li>
        </ul>
</div>

看起来，我需要编辑我的javascript代码。任何想法如何做到这一点？

Answer 1

以下内容将活动类添加到URL中包含id=1的任何链接：

$('.nav a[href*="id=1"]').addClass('active');

您可以更改匹配的部分（＆＃34; id = 1＆＃34; ）以选择您需要的任何网址条件。

Answer 2

使用var url = location.pathname + location.search;

W3Schools information

编辑：因为它似乎需要解析结尾：

var ending = url.slice(url.lastIndexOf('/'));

使用jquery突出显示当前菜单项

2 个答案: