Question

我有一个带有_Layout页面的MVC应用程序，它收集主导航栏。

对于每个li类，都需要一个特定的类来突出显示当前页面。

 <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-parent-item current-menu-item page_item current_page_item">
  @Html.ActionLink("Home", "index", "Home")<i class="fa fa-home hidden-xs"></i>
 </li>

如何在当前页面上将其添加到其他li类，同时在浏览时将其从Home中删除。

Answer 1

您可以实现此目的的一种方法是从window.location.href中提取网址，通过正则表达式提取网址的相关部分，然后找出一些方法将其与相应的导航按钮相匹配，并提供此按钮一个突出它的类 - 如：

.current-page {
    background-color: yellow;
}

一个更简单的解决方案就是将这个类（或其他类）添加到每个单独视图的导航链接上 - 如下所示：

// <li id="about-me-section" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-parent-item current-menu-item page_item current_page_item">

$("#about-me-section").toggleClass("current-page");
$("#home-section").toggleClass("current-page");

根据MVC中的当前网页更改li类

1 个答案: