【问题标题】:How to change a class of a menu item in Rails如何在 Rails 中更改菜单项的类别
【发布时间】:2013-02-01 23:05:45
【问题描述】:

我有一个带有菜单导航的布局。我正在使用我在网上找到的模板。每个菜单项都有一个 HTML 页面,并且每个相应页面的 li 项类称为“已选择”。它看起来像这样:

  <nav>
    <ul class="sf-menu" id="nav">
      <li class="selected"><%= link_to "home", root_path %></li>
      <li><%= link_to "about me", about_path %></li>
      <li><%= link_to "my portfolio" %>
        <ul style="z-index: 2;">
          <li style="z-index: 2;"><%= link_to "portfolio one", portfolio_one_path %></li>
          <li style="z-index: 2;"><%= link_to "portfolio two", portfolio_two_path %></li>
          <li style="z-index: 2;"><%= link_to "portfolio three", portfolio_three_path %></li>
        </ul>
      </li>
      <li><%= link_to "blog", blog_path %></li>
      <li><%= link_to "contact", contact_path %></li>
    </ul>
  </nav>

所以这是在我的application.html.erb 文件中。我的问题是如何根据用户单击的链接以编程方式将每个 li 项目的类更改为“已选择”?这可以用 Ruby 完成还是我需要使用 JavaScript?

【问题讨论】:

    标签: jquery ruby ruby-on-rails-3


    【解决方案1】:

    我认为您需要 current_page? 辅助方法 - http://api.rubyonrails.org/classes/ActionView/Helpers/UrlHelper.html#method-i-current_page-3F

    <li class="<%= "selected" if current_page?(root_path) %>"><%= link_to "home", root_path %></li>
    ...
    

    【讨论】:

      【解决方案2】:

      我认为你想做这样的事情:

      <%= link_to "portfolio one", portfolio_one_path,  class: current_page?(products_path) ? "selected" : "not_selected" %>
      

      为您的链接

      【讨论】:

        【解决方案3】:

        控制器和动作名称可用于参数哈希中的视图。因此,如果这些是不同的操作/控制器,您可以执行以下操作:

        <li class=<%= "selected" if params[:controller] == 'portfolio' && params[:action] == 'action_name' %>><%= link_to "portfolio one", portfolio_one_path %></li>
        

        我个人不是这种方法的忠实拥护者,并且直接将其保留在我的观点中。通常,我将逻辑推送到我的助手中并使用它们。

        【讨论】:

          猜你喜欢
          • 2014-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2015-07-27
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多