Question

我正在将Twitter Bootstrap Framework用于我的页面的某些设计部分。

我尝试设置可以关闭的提醒。我的代码看起来就像那样：

<div id="index-alert" class="alert alert-danger .alert-dismissible">
    <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
    <b>An Error occured</b>
</div>

右上角有一个可点击的X，但没有任何反应。

firebug控制台也没有给我任何错误。

我正在使用Bootstrap版本3.2.0

有人知道我做错了吗？

Answer 1

试试这个

<div id="index-alert" class="alert alert-danger alert-dismissable">
    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
    <b>An Error occured</b>
</div>

如果失败，请确保您引用了<script src="js/bootstrap.min.js"></script>

Answer 2

您应该写alert-dismissible而不是.alert-dismissible;）

不要忘记在</body>结束标记之前添加jQuery.js和bootstrap.js文件。首先必须添加jQuery：

<script src="/jquery-3.2.1.min.js"></script>
<script src="/bootstrap.min.js"></script>

Answer 3

如果这些答案都不起作用，您始终可以将内联 javascript 放入 HTML 标记中。

免责声明：这是一种不好的做法，尽可能不要编写这样的代码。

现在试试这个：

<div class="alert alert-info alert-dismissible fade show" role="alert">
<button type="button" class="close" onclick="this.parentElement.style.display='none';"><span>×</span></button> This is a dismissable message.
</div>

Twitter Bootstrap Alert不会关闭

3 个答案: