重定向到另一个页面时,如何在链接或li上设置/保留“活动”类?

时间:2018-08-10 21:02:38

标签: javascript c# jquery asp.net-mvc

在我的视图中,我可以导航,但是问题是,当我单击链接并将我重定向到该页面时,它失去了活动类别,并且再次成为活动场所。任何人都可以帮助我或为我指明正确的方向!
预先感谢。

查看:

<!-- Side Navbar -->
  <nav class="side-navbar shrinked">

      <!-- Sidebar Navidation Menus-->
      <ul class="list-unstyled">
          <li class="active"><a href="/User/Home"> <i class="icon-home"></i>Home </a></li>
          <li><a href="/User/AddEmployee"> <i class=" icon-grid"></i>EMP </a></li>
          <li><a href="/User/AddUser"> <i class="fa fa-bar-chart"></i>User </a></li>
      </ul>

  </nav>

JavaScript:

<script>
    $(function () {

        $('nav.side-navbar ul li a').on('click', function () {
            $(this).parent().addClass('active').siblings().removeClass('active');
        });


    });
</script>

1 个答案:

答案 0 :(得分:2)

当您加载新页面时,当前页面中的所有代码都将消失,您拥有的所有脚本都将在新页面上再次运行。

您需要将页面的URL与页面加载时的链接URL进行比较。

尝试以下操作:

$(function() {
  $('nav.side-navbar ul li a').each(function() {
    var isActive = this.pathname === location.pathname;
    $(this).parent().toggleClass('active', isActive);
  });
});