为一个页面引导程序网站获取动态活动li

时间:2016-09-01 14:31:43

标签: ruby-on-rails twitter-bootstrap slim-lang

我想在当前页面上为active提供动态属性li。我看到了这个话题:How to get Twitter-Bootstrap navigation to show active link?,但解决方案对我不起作用。我没有部分视图的特定控制器。方法current_page不适用于href。我没有使用已定义的路由,这就是为什么没有link_to

我尝试使用data-toggle =“pills”,正确标记导航栏当前点击了一个链接,但没有引用(未更改视图)。

    li
      a.waves-effect.waves-light href="#{root_path}#slider" Home
    li
      a.waves-effect.waves-light href="#{root_path}#about" About us
    li
      a.waves-effect.waves-light href="#{root_path}#price" Price
    li
      a.waves-effect.waves-light href="#{root_path}#contact" Contact

1 个答案:

答案 0 :(得分:5)

Twitter Bootstrap选项卡默认情况下为#34;单页&#34;,并且应立即在您的情况下工作。检查您的父<ul>。您的代码应如下所示:

<ul class="nav nav-tabs">
  <li class="active waves-effect waves-light">
    <a href="#slider" data-toggle="tab">Home</a>
  </li>
  <li class="waves-effect waves-light">
    <a href="#about" data-toggle="tab">About us</a>
  </li>
  <li class="waves-effect waves-light">
    <a href="#price" data-toggle="tab">Price</a>
  </li>
  <li class="waves-effect waves-light">
    <a href="#contact" data-toggle="tab">Contact</a>
  </li>
</ul>

注意:您的链接中不需要root_path,因为这实际上会打开一个新页面,而您不希望这样,因为您的链接是单页