javascript - 关闭 Bootstrap 警报

Question

我正在使用 https://github.com/thoughtbot/paul_revere gem 用于管理我的 Rails 应用程序中的公告。这个 gem 有部分显示公告。它看起来像这样:

<% if announcement_visible?(current_announcement) %>
  <div id="announcement">
    <span><%= current_announcement.body.html_safe %></span>
    <span class="hide">
      <%= link_to "hide", "#", onclick: "hideAnnouncement('#{current_announcement.to_cookie_key}')" %>
    </span>
  </div>
<% end %>

我为它添加了一些 CSS:

#announcement{
  position: relative;
  left: 10px;
  width: 50%;

  @extend .alert;
  @extend .alert-dismissible;
  @extend .alert-info;
  @extend .animated;
  @extend .fadeInUp;
}

它看起来像这样:

但我无法使隐藏链接以隐藏警报的功能起作用。而且我也想要 x 而不是 hide。有没有什么方法可以使用纯 css 而不覆盖 gem partial？

Answer 1

如果您无法在源代码或 gem 文件中更改它，请添加这个 jQuery 位好吗？

$(document).ready(function () {
  $("#announcement").find(".hide").html("×").attr("data-dismiss", "alert");
});