我的Bootstrap警报在关闭后不会显示 [英] My Bootstrap alert will not display after being closed

问题描述

您好，我有以下隐藏在页面上的提醒：

 < div class =alert alert-success id =selectCodeNotificationAreahidden =hidden> 
< button type =buttonclass =closedata-dismiss =alert>& times;< / button> 
 @TempData [selCode] 
< / div> 
  

我用下面的javascript显示它：

<$点击（函数（）{
var selRowIds = $（＃ApprovalGrid）。jqGrid（'getGridParam'，'selarrrow'）; pre> $（'＃send_reject_btn'）。
if（selRowIds.length> 0）{
$（'＃reject_alert'）。show（）;
} else {
$（'＃selectCodeNotificationArea'）。show （）;
}
}）;


这显然与我的html中的按钮有关。

如果我使用< button type =buttonclass =closedata-dismiss =alert>& times;< / button> 下一次按下按钮打开警报时，可以看到 $（'＃selectCodeNotificationArea'）。show（）; 在我的调试屏幕中调用，但警报不再显示。

以前有谁经历过这种情况？

解决方案

Data-dissmiss completley删除元素。如果您打算再次显示，则需要隐藏该提醒。

例如;

 < div class =alert alert-successid =selectCodeNotificationAreahidden =hidden> 
< button type =buttonclass =closedata-hide =alert>& times;< / button> 
 @TempData [selCode] 
< / div> 
  

和这个JS

 （click，function（）{
 $（this）.closest（）。 $（function（）{
 $（[data-hide]）。 + $（this）.attr（data-hide））。hide（）; 
}）; 
}）; 
  

Hi I have the following alert that is hidden on the page

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

I display it with the following javascript

    $('#send_reject_btn').click(function () {
        var selRowIds = $("#ApprovalGrid").jqGrid('getGridParam', 'selarrrow');
        if (selRowIds.length > 0) {
            $('#reject_alert').show();
        } else {
            $('#selectCodeNotificationArea').show();
        }
    });

This is obviously linked to a button in my html.

After the alert is shown if I close it using the<button type="button" class="close" data-dismiss="alert">&times;</button> The next time I press the button to open the alert I can see $('#selectCodeNotificationArea').show(); being called in my debug screen but the alert doesn't display again.

Has anyone experienced this before?

解决方案

The Data-dismiss completley removes the element. You would need to hide the alert if you are intending on showing it again.

For example;

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

and this JS

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

这篇关于我的Bootstrap警报在关闭后不会显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！