Question

这可能是最简单的问题，但有时我的愚蠢无所不知。

我正在尝试创建一个简单的导航菜单。单击导航菜单中的链接后，它应该变成一些不同的布局并保持这样。我正在使用这个jquery代码，

$(function()
{

    $(".top a").click(function()
    {
        $(this).parent().addClass('active').siblings().removeClass('active');
    };

});

这是菜单，

<ul class="top">

<li><a href="http://example.com/index.php" class="home"></a></li>

<li><a href="http://example.com/page.php?id=1" class="charter"></a></li>

<li><a href="http://example.com/about_us.php" class="about"></a></li>

<li><a href="http://example.com/policy.php" class="policy"></a></li>

<li><a href="http://example.com/page.php?id=4" class="code"></a></li>

<li><a href="http://example.com/humanitarian.php" class="human"></a></li>

</ul>

每当有人点击任何链接时，我都会将类激活分配给li标记。但是这个类在页面加载时会丢失。有人可以建议我如何保持活动类在那里并在页面加载后保持链接活动。似乎有些东西我不知道。

感谢。

Answer 1

页面的JavaScript更改不会在页面之间保留。相反，你可以尝试这样的事情：

$(function () {
    $('.top a').each(function () {
        if (this.href == window.location.href) {
            $(this).addClass('active');
            return false;
        }
    });
});

以上代码将浏览您的导航并将active添加到与该窗口位置匹配的第一个锚点。

Jquery导航菜单问题

1 个答案: