Question

似乎无法解决这个问题，希望有人可以帮助我。导航栏折叠正常，但切换按钮没有响应。

使用Twitter Boostrap gem并遵循所有说明。

的Gemfile：

gem "twitter-bootstrap-rails"

应用程序CSS：

 *= require_self
 *= require bootstrap_and_overrides
 *= require_tree .

应用程序JS：

//= require twitter/bootstrap
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .

布局：

!!!
%html
 %head
%title=yield(:title)
= stylesheet_link_tag "application", controller.controller_name
= javascript_include_tag "application", controller.controller_name
= csrf_meta_tags
%meta{ :name => "viewport", :content => "width=device-width, initial-scale=1.0"}

%body
.navbar.navbar-fluid-top.navbar-fixed-top
    .container
        %button{ :class => "btn btn-navbar navbar-toggle", "data-toggle" => "collapse", "data-target" => ".navbar-collapse" }
            %span{ :class=> "sr-only" } Toggle Navigation
            %span.icon-bar
            %span.icon-bar
            %span.icon-bar
    .container.nav-collapse
        %ul.nav.navbar-nav.navbar-right
            -if User.find_by_id(session[:user_id])
                %li
                    =link_to 'Home', '/'
                %li
                    =link_to 'About', '/about/'
                %li
                    =link_to 'Work', '/portfolios/'
                %li
                    =link_to 'Journal', '/journals/'
                %li
                    =link_to 'Get in Touch', '/contact/'
                %li
                    |
                %li
                    =link_to 'Users', '/users'
                %li
                    =link_to 'Log Out', logout_path, method: :delete

            -else
                %li
                    =link_to 'Home', '/'
                %li
                    =link_to 'About', '/about/'
                %li
                    =link_to 'Work', '/portfolios/'
                %li
                    =link_to 'Journal', '/journals/'
                %li
                    =link_to 'Get in Touch', '/contact'

= yield

=render 'layouts/footer'

Answer 1

我遇到与OP完全相同的问题，只有我的application.js文件没有包含

//= require bootstrap

另外我注意到OP已经

//= require twitter/bootstrap

严格来说，这是不一样的。

无论如何 - 我不知道为什么在我的情况下没有自动添加require子句，也不知道为什么在我找到的任何文档中都不需要它存在或手动添加...谢谢在我的案例中，Joshua Paling给出了正确答案。

Application.js:

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
//= require bootstrap

Rails＆amp; Bootstrap - 切换导航栏按钮无响应

1 个答案: