关闭引导模式

Question

我有一个引导模式对话框，我想首先显示，然后当用户单击页面时，它就消失了。我有以下内容：

$(function () {
   $('#modal').modal(toggle)
});

 <div class="modal" id='modal'>
     <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="myModalLabel">Error:</h3>
        </div>
        <div class="modal-body">
        <p>Please correct the following errors:</p>
        </div>
     </div>
 </div>

最初会显示该模式，但在模式之外单击该模式时不会关闭。此外，内容区域不是灰色的。我如何使模式显示最初，然后关闭后，用户点击该区域以外？我怎样才能让背景像演示一样变灰？

Answer 1

要关闭引导模式，您可以将“hide”作为选项传递给模式方法，如下所示

$('#modal').modal('hide');

请看一下这里的工作小提琴

bootstrap还提供了可以与模式功能挂钩的事件，例如，如果您希望在模式完成对用户隐藏时激发事件，您可以使用hidden.bs.modal事件您可以在文档中阅读关于模式方法和事件的更多信息

如果上面的方法都不起作用，给你的关闭按钮一个id并触发点击关闭按钮。

Answer 2

将modal('toggle')替换为modal(toggle)

$(function () {
   $('#modal').modal('toggle');
});