数据消除完全删除元素。如果您打算再次显示警报，则需要隐藏它。
例如：

<div class="alert alert-success" id="selectCodeNotificationArea" hidden="hidden">
    <button type="button" class="close" data-hide="alert">&times;</button>
    @TempData["selCode"]
</div>

而这个JS

$(function(){
    $("[data-hide]").on("click", function(){
        $(this).closest("." + $(this).attr("data-hide")).hide();
    });
});

更好的方法是从标记中删除，data-dismiss="alert"，并使用类名，即close来隐藏和显示错误/警告。

// WHEN CLOSE CLICK HIDE THE ERROR / WARNING .
$(".close").live("click", function(e) 
{   
    $("#add_item_err").hide();
});

// SOME EVENT TRIGGER IT.
$("#add_item_err").show();

[我正在处理动态添加的元素，这就是为什么我使用“live”，您可能需要根据您的要求进行更改。]

Bootsrap $(selector).alert('close')（http：//getbootstrap.com/javascript/#alerts）实际上删除了警报元素，因此您无法再次显示它。要实现所需的功能，只需从关闭按钮定义中删除data-dismiss="alert"属性，并添加一些小事件处理程序来隐藏警报

<div class="alert alert-success" id="selectCodeNotificationArea" hidden="hidden">
   <button type="button" class="close alert-close">&times;</button>
   @TempData["selCode"]
</div>

<script>
$(function() {
   $(document).on('click', '.alert-close', function() {
       $(this).parent().hide();
   })
});
</script>

我也遇到了这个问题，上面勾选的解决方案的问题是我仍然需要访问标准的 Bootstrap 警报关闭事件。
我的解决方案是编写一个small, customisable, jquery plugin，它注入一个格式正确的Bootstrap 3警报（根据需要，可以有或没有关闭按钮），并允许您在关闭后轻松地重新生成它。
有关用法、测试和示例，请参见https://github.com/davesag/jquery-bs3Alert。

实际上， Bootstrap 警报是被设计为删除而不是隐藏的。你可以通过查看警报消息来判断，它没有任何 Package 元素。因此，任何更改警报消息的尝试都需要额外的代码（查找文本节点元素）。你应该重新设计你的应用程序，并在每次你想更改或再次显示它时创建新的.alert元素。

我采用了以下工作方法。

$(document).ready(function(){
    $("#btnFV").click(function()
    {
        $("#alertFV").addClass("in");
    });

    $("#alertFV").on("close.bs.alert", function ()
    {
        $("#alertFV").removeClass("in");
        return false;
    });
});

Html正文包含以下警报

<button id="btnFV" class="form-control">Button To Show/Hide Alert</button>

<div id="alertFV"  class="alert alert-danger alert-dismissable fade show">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
         <span aria-hidden="true">&times;</span>
      </button>
      <strong>Danger!</strong> 
    </div>

Bootstrap 5解决方案--〉使用.NET Core 5.0进行测试
Bootstrap 警报HTML代码（这些代码存储在Razor视图组件中）

<!-------------------------------->
<!-- INFORMATION Bootstrap Alert-->
<!-------------------------------->
<div class="alert alert-info alert-dismissible fade show bg-info" role="alert" id="bootstrapInformationAlertDiv" style="display:none;">
    <div class="custom-alert-div-information text-light font-weight-bold text-dark" id="bootstrapInformationAlertMessageDiv">&nbsp;</div>
    <button type="button" class="btn-close" aria-label="Close" id="bootstrapInformationAlertBtn"></button>
</div>
<!---------------------------->
<!-- SUCCESS Bootstrap Alert-->
<!---------------------------->
<div class="alert alert-success alert-dismissible fade show bg-success" role="alert" id="bootstrapSuccessAlertDiv" style="display:none;">
    <div class="custom-alert-div-success text-light font-weight-bold" id="bootstrapSuccessAlertMessageDiv">&nbsp;</div>
    <button type="button" class="btn-close" aria-label="Close" id="bootstrapSuccessAlertBtn"></button>
</div>
<!---------------------------->
<!-- WARNING Bootstrap Alert-->
<!---------------------------->
<div class="alert alert-warning alert-dismissible fade show bg-warning" role="alert" id="bootstrapWarningAlertDiv" style="display:none;">
    <div class="custom-alert-div-warning text-black font-weight-bold" id="bootstrapWarningAlertMessageDiv">&nbsp;</div>
    <button type="button" class="btn-close" aria-label="Close" id="bootstrapWarningAlertBtn"></button>
</div>
<!--------------------------->
<!-- DANGER Bootstrap Alert-->
<!--------------------------->
<div class="alert alert-danger alert-dismissible fade show bg-danger" role="alert" id="bootstrapDangerAlertDiv" style="display:none;">
    <div class="custom-alert-div-danger text-light font-weight-bold" id="bootstrapDangerAlertMessageDiv">&nbsp;</div>
    <button type="button" class="btn-close" aria-label="Close" id="bootstrapDangerAlertBtn"></button>
</div>

上述视图组件添加在每个网页的顶部：

<!-- Bootsrap Alert View Component -->
<div>
    @await Component.InvokeAsync("BootstrapAlert")
</div>

然后，我在项目中添加了一个小JS文件（bootstrapAlert.js）：

$("#bootstrapInformationAlertBtn").click(function () {
    event.preventDefault();
    $(this).parent().hide();
});

$("#bootstrapSuccessAlertBtn").click(function () {
    event.preventDefault();
    $(this).parent().hide();
});

$("#bootstrapWarningAlertBtn").click(function () {
    event.preventDefault();
    $(this).parent().hide();
});

$("#bootstrapDangerAlertBtn").click(function () {
    event.preventDefault();
    $(this).parent().hide();
});

在我的主布局.cshtml文件中，我将脚本ref添加到上面的js文件中，这样它就可以自动加载到我站点中的每个页面：

<!-- Load the js script file on each page for hiding the bootstrap alert when closed -->
<script src="~/js/bootstrap-alert-custom-scripts/bootstrapAlert.js"></script>

当从我的任何JavaScript函数调用要打开的引导警报时，我使用以下代码：

window.scrollTo(0, 0); // Scroll to the top of the page.
document.getElementById("bootstrapWarningAlertMessageDiv").innerHTML = 'Write your custom message here for the current issue / notification!';
$("#bootstrapWarningAlertDiv").show();
setTimeout(function () { $("#bootstrapWarningAlertDiv").hide(); }, 8000);

窗口滚动到命令是一个很好的小触摸，因为用户可能会滚动到页面的某个地方，如果你总是在同一个地方添加警报，即在页面的顶部，那么他们不一定会看到它时，它打开了。

正如 Bootstrap 文档中提到的，单击关闭按钮时，alert元素将完全删除
解除警报后，元素将从页面结构中完全删除。
但是，如果您使用bootstrap 4，则可以删除data-dismiss="alert";如果您使用bootstrap 5，则可以删除data-bs-dismiss="alert"，并向类似onclick="this.parentElement.style.display='none'"的关闭按钮添加一个单击事件，从而停止此行为。示例：

<div class="alert alert-primary alert-dismissible fade show" role="alert" style="display: none;">
    <span class="message"></span>
    <button type="button" class="btn-close" aria-label="Close" onclick="this.parentElement.style.display='none'"></button>
</div>