javascript - 将当前链接设置为事件链接

Question

我正在使用 metis menu喜欢

<ul class="nav">
    <li>
        <a href="#">Choose action<span class="fa arrow"></span></a>
        <ul class="nav nav-second-level in">
           <li>
               <a href="@Url.Action("Index", "Home")"><i class="fa fa-angle-right"></i> Home</a>
           </li>
           <li>
               <a href="@Url.Action("Account", "Login")"><i class="fa fa-angle-right"></i> Login</a>
               </li>
         </ul>
    </li>
</ul>

When clicking on home action link I'm getting this link with css class active as it should. But problem is that when I click on other link login action this link is also decorated with action link together with home link.

如何将 css class active 设置为仅当前“选定”的链接？

Answer 1

您可以使用以下js 来激活当前链接。

$('.nav a').each(function() {
    if (window.location.href.indexOf(this.href) > -1) {
        $(this).parent().addClass('active');
    }
});