2

我正在使用此代码进行导航:

.row-fluid
    .span3
      .well
        %ul.nav.nav-tabs.nav-stacked
          %li.nav-header
            Menu
          %li
            %a{:href => "/cms/1"} page1
          %li
            %a{:href => "/cms/2"} page2
          %li
            %a{:href => "/cms/3"} page3
          %li
            %a{:href => "/cms/4"} page4

如果我把它.active放在%li它使项目处于活动状态,我怎样才能动态地做到这一点,以便它反映哪个页面当前处于活动状态?我已经安装了所有的引导 javascript 文件。

4

2 回答 2

1

看看如何让 Twitter-Bootstrap 导航显示活动链接?.

在那个问题中,有很多“自动检测”当前页面的替代方法,因此可以轻松地在相关菜单项上设置活动类。

于 2013-01-24T19:37:16.347 回答
1

您可以像这样创建一个辅助函数:

def active_navigation(item, param)
  "class='active'" if params[param] == item
end

然后在你看来,你放了这样的东西:

%li.nav-header
  Menu
%li{:class => active_navigation(1, :id)}
  %a{:href => "/cms/1"} page1
%li{:class => active_navigation(2, :id)}
  %a{:href => "/cms/2"} page2
%li{:class => active_navigation(3, :id)}
  %a{:href => "/cms/3"} page3
%li{:class => active_navigation(4, :id)}
  %a{:href => "/cms/4"} page4

我只是不知道/讨厌haml,所以我认为语法不正确。但我确实认为这是一个很好的例子,您可以尝试适应自己的领域。

于 2012-11-13T12:26:37.680 回答