Question

我试图在每个导航栏菜单项下选中时保持白色下划线但是当我点击导航栏中的每个菜单项时，我会进行整页刷新，因为我将用户指向新的控制器/动作/视图。我如何坚持css，以便即使我重新定向到具有新视图的新控制器后，我仍然有下划线的菜单项被点击？注意 - 视图会重新呈现导航栏菜单，该菜单包含在部分视图中

$(document).ready(function() {
  $(".nav-pills a").click(function() {
    $(".nav-pills a").removeClass("active");
    $(this).addClass("active");
    //$(this).css("color", "black");
  });
});

   .menupartial {
     background-color: #16749F;
     /*opacity: .9;*/
     /*width: 100%;*/
     margin-bottom: 20px;
   }
   .menupartial a {
     color: lightgrey;
     font-weight: bold;
   }
   .nav-pills > li > a {
     border-radius: 0;
   }
   .nav-pills > li > a:hover {
     border-radius: 0;
     background-color: #16749F;
     color: white;
   }
   .nav-pills > li > a:active,
   .nav-pills > li > a.active {
     border-bottom: 5px solid white;
   }
   /*div.container.body-content {
           background-color: yellow;
            
        }*/

<div class="row menupartial">
  <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
    <ul class="nav nav-pills">
      <li>@Html.ActionLink("User", "UserProfile", "Account")</li>
      <li>@Html.ActionLink("Profiles", "Index", "Profile")</li>
      <li>@Html.ActionLink("YogaSpaces", "Index", "YogaSpace")</li>
      <li><a href="#">Your Schedules</a>
      </li>
      <li><a href="#">Your Messages</a>
      </li>
      <li><a href="#">Your Groups</a>
      </li>
      <li><a href="#">Your Friends</a>
      </li>
    </ul>
  </div>
</div>

Answer 1

<ul class="nav nav-pills">
    <li class="@(ViewContext.RouteData.Values["Action"].ToString() == "User" ? "active" : "")">@Html.ActionLink("User", "UserProfile", "Account")</li>
    <li class="@(ViewContext.RouteData.Values["Action"].ToString() == "Profiles" ? "active" : "")">@Html.ActionLink("Profiles", "Index", "Profile")</li>
    <li class="@(ViewContext.RouteData.Values["Action"].ToString() == "YogaSpaces" ? "active" : "")">@Html.ActionLink("YogaSpaces", "Index", "YogaSpace")</li>
</ul>

在这里使用bootstrap类。

完整页面刷新后如何保存CSS信息

1 个答案: