Question

在我的Rails 4应用程序中，我使用Bootstrap 3。

特别是，我使用Bootstrap来显示和设置flash消息的样式。

这就是我在application.html.erb布局文件中的内容：

<div class="flash">

    <% flash.each do |key, value| %>
      <div class="alert alert-<%= key %> alert-dismissible">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <%= value %>
      </div>
    <% end %>

</div>

Flash消息会在预期时出现，并在2秒后消失，这要归功于custom.js中assets/javascript文件中的以下JS代码：

$('document').ready(function() {
  setTimeout(function() {
    $('.flash').slideUp();
  }, 2000);
});

只有问题，我无法弄清楚如何获得“x”按钮，以便用户在看到它后隐藏Flash消息。

Bootstrap documentation说：

需要JavaScript警报插件才能完全正常运行，不允许使用警报，您必须使用警报JavaScript插件。

我按照链接到达there，但不明白我们在谈论哪个插件。

这是我的application.js：

的内容

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require moment
//= require bootstrap-datetimepicker
//= require bootstrap/dropdown
//= require bootstrap/modal
//= require bootstrap
//= require turbolinks
//= require_tree .

我在这里错过了什么吗？

Answer 1

尝试将//= require bootstrap-sprockets添加到您的application.js文件

...
//= require bootstrap-sprockets
//= require_tree .

bootstrap-sprockets是bootstrap JavaScript支持。

Rails 4 x Bootstrap 3：不允许的警报不起作用

1 个答案: