php - 将活动类添加到标签

Question

我想在<li>访问特定 url 时添加活动类？

我的代码看起来像这样，

<ul>
<li>
    <a href="link1">Link1</a>
</li>
<li>
    <a href="link2">Link2</a>
</li>
<li>
    <a href="link3">Link3</a>
</li>
<li>
    <a href="link4">Link4</a>
</li>
<li>
    <a href="link5">Link5</a>
</li>
<li>
    <a href="link6">Link6</a>
</li>
</ul>

如果 URL 中存在 www.abc/link1 则只有第一个 li 应该处于活动状态，其余的应该没有任何类。

提前致谢

Answer 1

以下是您可以使用 JavaScript 实现的方法...

var normalisePath = function(path) { return path.replace(/^\/|\/$/g, ''); },
var path = normalisePath(window.location.pathname),
    li = document.getElementsByTagName('li'),
    i, length, a;

for (i = 0, length = li.length; i < length; i++) {
    a = li[i].getElementsByTagName('a')[0];

    if (normalisePath(a.pathname) == path) {
        li[i].className += ' active';
        break;
    }
}

Answer 2

使用 jQuery，您可以使用：

$("li").addClass("active");

不过，您必须开发逻辑部分...

编辑： ...下面是：

$(function() {
    $("li").removeClass("active");
    var current = window.location.pathname.split('/').pop();
    $('a[href="' + current + '"]').addClass("active");
});

Answer 3

只需将变量添加到与每个页面一起出现的 url

www.abc/link1?link_num=1

然后

switch($_GET[link_num]){
case '1':
    $style1 = 'class=active';
    break;
case '2';
    $style2 = 'class=active';
    break;
etc...
}

然后

<ul>
<li>
<a href="link1?link_num=1" <?=$style1?>>Link1</a>
</li>
<li>
<a href="link2?link_num=1" <?=$style2?>>Link2</a>
</li>
<li>
etc

我敢肯定有更好的方法，但这会做到

Answer 4

查看

var path = window.location.pathname

并将其与您li的 s 进行比较。active将类添加到s href 匹配li的类。apath