Jquery 重新加载页面后在导航栏中保留选定项

如何保留选定/活动的导航栏项目，以便在重新加载页面后重新选择

我用的是bootstrap，但我不认为这是特别相关的。我相信我希望将所选项目存储在单击页面上，然后在加载页面上重新选择该项目。但是我该怎么做呢？我看到的大部分内容都基于该项目的href参数，但在某些地方我使用ActionLink

更复杂的是，我还有三个导航栏（一个菜单、一个子菜单和一个子菜单，如果你喜欢），所以我想在每个导航栏中保留所选的项目（并设置一个默认项目）。同样，如果我在菜单中选择和项目，它应该自动选择其子菜单中的默认（第一个）项目

<nav class="navbar navbar-inverse fixed-top">
    <div class="container-fluid">
        <ul class="nav navbar-nav">
            <li><a href="/Controller1/Index/">Menu Item 1</a>)</li>
            <li><a href="/Controller2/Index/">Menu Item 2</a>)</li>
            <li><a href="/Controller3/Index/">Menu Item 3</a>)</li>
        </ul>
    </div>
</nav>

if (IsSectionDefined("SubMenu"))
{
    <nav class="navbar navbar-inverse fixed-top">
        <div class="container-fluid">
            <ul class="nav navbar-nav">
                @RenderSection("SubMenu")
            </ul>
       </div>
    </nav>
}

if (IsSectionDefined("SubSubMenu"))
{
    <nav class="navbar navbar-inverse fixed-top">
        <div class="container-fluid">
            <ul class="nav navbar-nav">
                @RenderSection("SubSubMenu")
            </ul>
        </div>
    </nav>
}

<script>
    $(document).ready(function (e) {
        $(".navbar li a").click(function () {
            $(".navbar li a").removeClass("selected");
            $(this).addClass("selected");
        });
    });
</script>

)
)
)

if（已定义的分区（“子菜单”））
{

@渲染（“子菜单”）

}
if（IsSectionDefined（“子菜单”））
{

@渲染部分（“子菜单”）

}
$（文档）.ready（函数（e）{
$（“.navbar li a”）。单击（函数（）{
$（“.navbar li a”）.removeClass（“选定”）；
$（此）.addClass（“选定”）；
});
});

子菜单的一个示例是：

@section SubMenu {
    <li><a href="/SubMenu1/">SubMenu Item 1</a>)</li>
    <li><a href="/SubMenu2/">SubMenu Item 2</a>)</li>
    <li><a href="/SubMenu3/">SubMenu Item 3</a>)</li>
}

@section SubSubMenu {
    <li><a href="/SubSubMenu1/">SubSubMenu Item 1</a>)</li>
    <li><a href="/SubSubMenu2/">SubSubMenu Item 2</a>)</li>
    <li><a href="/SubSubMenu3/">SubSubMenu Item 3</a>)</li>
}

@节子菜单{
)
)
)
}
@节子菜单{
)
)
)
}

试试下面的代码，如果它对您也不起作用，请告诉我-

$(document).ready(function () {
        $(".navbar li a").click(function () {
            var id = $(this).attr("id");

            $('#' + id).siblings().find(".active").removeClass("active");
            $('#' + id).addClass("active");
            localStorage.setItem("selectedolditem", id);
        });

        var selectedolditem = localStorage.getItem('selectedolditem');

        if (selectedolditem != null) {
            $('#' + selectedolditem).siblings().find(".active").removeClass("active");
            $('#' + selectedolditem).addClass("active");
        }
    });

---

请在提出这些问题时限制使用HTML/CSS。@Praveen你的意思是什么？@PraveenKumar。。是的，你们是什么意思？？？你们两个，

@Html.ActionLink（“SubSubMenu项2”，“SubSubMenu2”）

不是Html，帖子也没有用

Razor

标记。简单的方法是从URL获取项目名称，用所有锚的href检查，并在同一个类上设置为活动是的，如果我给每个

…

块一个id，这就行了。谢谢。但是，当我在sun菜单上选择一个项目时，我会丢失菜单上的活动项目。我认为这可以通过在每个导航栏上有一个本地存储来解决。@B\D很高兴听到它对你有用，是的，现在你也可以在子菜单上使用它了。