【问题标题】:Rails 4: link_to broken in Bootstrap contextRails 4:link_to 在 Bootstrap 上下文中损坏
【发布时间】:2015-01-21 02:57:59
【问题描述】:

所以我正在关注 Twitter Bootstrap 文档并尝试实现一个简单的下拉列表 <a> 链接,并在我的 .navbar 中抛出一些额外的属性(参见 http://getbootstrap.com/components/#navbar-default

文档中的行是:

<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>

我在 Rails 中翻译为:

 =link_to who_we_are_path, class:'dropdown-toggle', role:'button', 'aria-expanded' =>'false', data:{toggle: 'dropdown'} do
      Who We Are
      %span.caret

生成以下 HTML:

<a aria-expanded="false" class="dropdown=toggle" data-toggle="dropdown" href="/who_we_are" role"button">
"Who We Are"
 <span class="caret"></span>
 </a>

这看起来完全有效。但是,当我单击 DOM 中的文本 "Who We Are" 时,它实际上并没有转到 /who_we_are 路径,但是当我将鼠标悬停在浏览器左下角看到的文本上时,我看到了 0.0.0.0:3000/who_we_are .

【问题讨论】:

  • 我觉得这可能是因为我将路径作为第一个参数传递而不使用“()”,但是当我尝试时我得到另一个语法错误......

标签: html css ruby-on-rails twitter-bootstrap


【解决方案1】:

那是因为,下拉菜单的作用是加载菜单项,Bootstrap 会阻止下拉菜单的默认值并显示菜单。您应该在菜单中添加您的链接,或者您必须覆盖引导程序默认值。 见http://getbootstrap.com/components/#dropdowns

试试这个

%div.dropdown
  =link_to "#", class:'dropdown-toggle', role:'button', 'aria-expanded' =>'false', data:{toggle: 'dropdown'} do
      Load Menu
      %span.caret
  %ul.dropdown-menu{role:"menu"}
    %li=link_to "Who We Are", who_we_are_path

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-10-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-10-23
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多