Question

对于我的导航栏，我有它，所以当我点击其中一个项目时，我的css类“current-menu-item”被激活。这在一定程度上起作用。我的Jquery代码如下：

$(document).ready(function(){
  $("li.menu").click(function(){
    $("li.menu").removeClass("current-menu-item");
    $(this).addClass("current-menu-item");
  });
});

这是rails link_to：

<li class="menu">
  <%= link_to "home", root_url %>
</li>

唯一的问题是此代码在重定向之前执行。所以我只能在加载新页面之前快速看到该类激活一小段时间，然后将其删除。

解决这种困境的最简单方法是什么？

Answer 1

如果您要使用JavaScript执行此操作，而不是在服务器端执行此操作，则可以将window.location.pathname与菜单链接的href属性进行比较。

这样的事情：

$.each("li.menu", function(i, menuItem) {
  if (menuItem.attr("href") === window.location.pathname) {
    menuItem.addClass("current-menu-item");
  }
});

请注意，除非您的路径名与href属性完全匹配，否则无法使用，因此很容易出错。

链接到页面后调用JQuery函数

1 个答案: