如何通过 jQuery 关闭引导警报消息？答案

【问题标题】：How to dismiss a bootstrap alert message via jQuery?如何通过 jQuery 关闭引导警报消息？
【发布时间】：2014-06-10 07:04:15
【问题描述】：

我尝试通过 jQuery 而不是 data-dismiss="alert" 关闭警报消息

我正在使用$("div.alert").alert();，但它似乎不起作用。

我的例子：Link

【问题讨论】：

按钮的事件处理程序在哪里，关闭？为什么你不能做data-dismiss="alert"-way？
@AndreasNiedermair，document 表示可以通过 javascript 解除警报消息，如果我没有理解错误，按钮似乎不需要事件处理程序。
@AndreasNiedermair，'启用通过 JavaScript 解除警报：$(".alert").alert('close')'。在 javascript 页面中不是组件
是的，下面几行你有一个可以工作的示例标记......你应该阅读组件文档：getbootstrap.com/components/#alerts
它之所以有效，是因为 'data-dismiss="alert"'，我只是想知道是否可以仅使用 javascript。

标签： jquery twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

这就是您要寻找的答案，不过您介意我问您为什么不想使用data-dismiss="alert"吗？

$('div.alert .close').on('click', function() {
   $(this).parent().alert('close'); 
});

Fixed fiddle

【讨论】：

我正在使用data-dismiss="alert"，只是好奇提到的javascript方式引导document

【解决方案2】：

我用这样的东西。

/* Fadeout Flash Notice */
  setTimeout(function() {
    $('.alert').fadeOut('slow');}, 3000
  );

【讨论】：

嗯，这有什么问题？与其只记下答案，不如给出一个你认为这不适合你的理由总是礼貌的
好的...您是否尝试过代码，这样警报就会逐渐消失，让用户无事可做，只需更改时间以满足您的要求

【解决方案3】：

试试这个：

<script>
$('.close').click(function(){
    $("div.alert").hide();

});
</script>

【讨论】：

@Harrison---你检查过上面的代码吗？这有什么问题..当你点击关闭 (x) 时警报会隐藏...这是 jquery ..？
我没有记下你。我很好奇为什么有人像你一样标记我的问题。
你的问题对我来说很清楚，我给出了解决方案。我没有标记你....-哈里森

【解决方案4】：

我已经更新了你的 JSFiddle：http://jsfiddle.net/9JLSW/57/

代码如下所示：

<div id="a"></div>
<div class="alert alert-success addDefinitionMessage alert-dismissable">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
    <span>12345</span>
</div>

如果你想在开头隐藏警报，你可以添加一个内联 css 为：

    <div id="a"></div>
        <div class="alert alert-success addDefinitionMessage alert-dismissable" style="display:none">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
            <span>12345</span>
        </div>

并使用 jQuery 显示警报：

<script>
$(document).ready(function(){
$('.alert').show();
});
</script>

【讨论】：