引导警报：如何在关闭时“隐藏”它们而不删除它们？答案

【问题标题】：Bootstrap alert : how to just 'hide' them without removing them when closing?引导警报：如何在关闭时“隐藏”它们而不删除它们？
【发布时间】：2020-07-08 20:50:32
【问题描述】：

我正在使用 bootstrap 4 Alerts 来显示错误消息等，例如他们的演示：

<div class="alert alert-warning alert-dismissible fade show" role="alert">
  <strong>Holy guacamole!</strong> You should check in on some of those fields below.
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>

我还使用 AJAX 调用来执行表单 POST。

我遇到的问题是，如果用户发帖，则会显示错误消息，但是如果用户单击关闭按钮并重新发布，如果发生错误，因为他之前关闭了上一个错误，我不能使用 d-block 取消隐藏警报容器，因为它根本不再存在于 DOM / Page 中。 DIV 元素已被破坏，或者至少我在 Chrome 的开发人员工具中看不到它。

我怎样才能解决这个问题，以便我的关闭按钮只是“隐藏”容器，而不是破坏它或它做的任何事情？即使在用户关闭后我也需要能够重新显示它。

干杯！帕特

【问题讨论】：

标签： javascript ajax bootstrap-4

【解决方案1】：

最终将data-dismiss="alert" 替换为onClick="$('#idOfDiv').addClass('d-none');" 类型的解决方案...

为您的帮助干杯！帕特

【讨论】：

【解决方案2】：

你尝试过使用一点 jQuery 或 Javascript 吗？

也许在顶角添加一些“箭头”图标。然后，将您的警报分为两部分：一个是永久保留的细条，另一个是在单击时“切换”

【讨论】：