无法使用带有Rails 4的Bootstrap关闭flash [:notice]消息

Question

无法使用带有Rails 4的Bootstrap关闭flash [:notice]消息

Bry*_*man 3 javascript twitter-bootstrap ruby-on-rails-4

使用带有Rails 4应用程序的Bootstrap 3,我在我的application.html.erb文件中设置了flash [:notice],flash [:error],flash [:alert],如下所示:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>

  <!-- Bootstrap -->
  <link href="css/bootstrap.min.css" rel="stylesheet">

  <%= stylesheet_link_tag    "application", media: "all", "data-turbolinks-track" => true %>
  <%= javascript_include_tag "application", "data-turbolinks-track" => true %>
  <%= csrf_meta_tags %>
</head> 
<body>
  <div class='container'>
    <ul class='nav nav-tabs'>
      <li><%= link_to 'Wikis', wikis_path %></li>
      <div class="pull-right user-info">
      <% if user_signed_in? %>
        Hello, <%= link_to current_user.name, edit_user_registration_path %> |
        <%= link_to 'Sign Out', destroy_user_session_path, method: :delete %>
     <% else %>
        <%= link_to 'Sign Up', new_user_registration_path %> or
        <%= link_to 'Sign In', user_session_path %>
     <% end %>
      </div>
   </ul>
 </div>

 <% if flash[:notice] %>
 <div class="alert alert-success">
   <button type="button" class="close" data-dismiss="alert">&times;</button>
   <%= flash[:notice] %>
 </div>
 <% elsif flash[:error] %>
 <div class="alert alert-danger">
   <button type="button" class="close" data-dismiss="alert">&times;</button>
   <%= flash[:error] %>
 </div>
 <% elsif flash[:alert] %>
 <div class="alert alert-warning">
   <button type="button" class="close" data-dismiss="alert">&times;</button>
   <%= flash[:alert] %>
 </div>
 <% end %>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <script src="js/bootstsrap.min.js"></script>

 <%= yield %>

</body>
</html>

Run Code Online (Sandbox Code Playgroud)

当我在开发和生产应用程序中收到通知,错误或警报时,我无法将其关闭.我试过移动这两个scrpt src,但它似乎没有任何影响.

Answer 1

Bry*_*man 8

更新:我能够通过添加//= require bootstrap到我的application.js文件来解决这个问题:

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

Run Code Online (Sandbox Code Playgroud)

归档时间：	10 年，8 月前
查看次数：	2133 次
最近记录：	8 年，7 月前