我想用不同的 CSS 在当前 URL 上创建链接。
例如：如果我在“/photos”中，我希望照片链接具有不同的颜色（处于活动状态）。
Rails 中没有方法可以做到这一点吗？
谢谢
【问题讨论】：
current_page? 工作链接：apidock.com/rails/ActionView/Helpers/UrlHelper/current_page%3F
标签： javascript jquery css ruby-on-rails
您可以测试params[:controller] 这样做：
%ul
%li= link_to 'Users', users_path, class: (UsersController.controller_name == params[:controller]) ? 'active' : 'not_active'
%li= link_to 'Photos', photos_path, class: (PhotosController.controller_name == params[:controller]) ? 'active' : 'not_active'
但是这似乎很繁重并且为每个链接复制/粘贴所有内容很烦人... -> 让我们做一个帮手！
# application_helper.rb
def active_if_in_controller?(*controllers)
is_in_controller = controllers.flatten.map(&:to_s).include? controller_name
is_in_controller ? 'active' : 'not_active'
end
# usage in views:
%ul
%li= link_to 'Users', users_path, class: active_if_in_controller?(UsersController.controller_name)
%li= link_to 'Settings', settings_path, class: active_if_in_controller?(Settings::UsersController, Settings::PhotosController)
【讨论】：
Ex: If I'm in "/photos", I want to have the Photos link to be in a different color 他不是在谈论具体的操作，我认为他只是想为他的菜单着色，其中只包含指向索引页面的链接。但这部分需要提问者的澄清
您可以在 application.html.erb 中的 body 标签中添加一个代表您当前控制器名称的类：
<body class="<%= controller.controller_name %>">
该代码将在“/photos”上产生此结果：
<body class="photos">
在您的 css 文件中添加如下内容：
body.photos a.active {
color: red
}
【讨论】：
.photos 和 .a 类的 body 标签，我认为您的意思是 body.photos a -- 但是，这仍然会在每个 @ 987654329@正文中包含的标签，不仅是“活跃”的那个...
链接（Rails）的创建必须给当前页面的链接添加一个特定的类。例如“积极的”。它应该看起来像这样：
<ul>
<li><a href="">link1</a></li>
<li><a href="" class="active">current link</a></li>
<li><a href="">link3</a></li>
</ul>
现在您应该相应地设置“活动”类的样式。 示例：
a.active {
color: #fff;
}
【讨论】：
您应该使用 javascript 来执行此操作。这样做的原因是简单的。当您想在服务器端执行此操作时，您需要触摸不适合初学者的link_to 方法。您可以使用 jQuery 轻松做到这一点：
$("a[href*='" + location.pathname + "']").addClass("current_link");
然后在css中：
.current_link {
# highlight the link in some kind
}
// 当你有很多 url 匹配一个页面时，你也可以使用规范链接元素，因为 SEO 原因。然后你也可以使用这个元素来突出显示正确的链接：
$("a[href*='" + $('link[rel=canonical]').attr('href') + "']").addClass("current_link");
当您使用 get 参数时，这将不起作用，但在这种情况下，您可以删除 url 中包含的所有参数，如果您可以找到解释 here。
【讨论】：
pathname 但具有不同的参数，例如/users/1/photos?filter=most_popular 和/users/1/photos?filter=most_shared，它将全部突出显示...