从https://github.com/twbs/bootstrap/issues/19385

Modal的显示/隐藏方法是异步的。因此，代码如下: foo.modal(“隐藏”);bar.modal(“秀”);是无效的。你需要等待 实际完成的显示/隐藏(通过侦听 显示/隐藏事件;看到 http://getbootstrap.com/javascript/#modals-events) 再次显示或隐藏方法。

我有这个问题时，我打开相同的模式两次太快，所以一个简单的解决方法是检查它是否已经显示，然后不显示它再次:

$('#modalTitle').text(...);
$('#modalMessage').text(...);
if($('#messageModal').is(':hidden')){
    $('#messageModal').modal('show');
}

最近我遇到了这个问题，这里提供的解决方案都没有帮助我。或者它完全摧毁了它，所以它不能再播放。 在文档准备也没有工作，但工作的是，我包装我所有的监听器与立即调用的函数，像这样:

$(function () {
    $('#btn-show-modal').click(function () {
        $("#modal-lightbox").modal('show');
    });

    $('#btn-close-modal').click(function () {
        $("#modal-lightbox").modal('hide');
    });
});

我也有同样的问题。我发现这是由于Bootstrap和JQueryUI之间的冲突。

两者都使用“close”类。改变其中一个类可以解决这个问题。

有些情况下，其他答案(有帮助的和有效的)不能很容易地应用。那么，一个可能的解决方案是实现一个事件，在模态对话框消失后不久触发对模态背景的单击。

下面是一个基于以下模态对话框的例子:

<div class="modal fade ..." id="IdOfMyModal" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
...
</div>

要在点击模态时删除“modal- background in”(在屏幕上创建背景不透明)，添加以下代码:

$('#IdOfMyModal').on("click", function() {
    setTimeout(function() {
        if ($('#IdOfMyModal').css("opacity") != "1")
            $('.modal-backdrop').trigger('click');
    }, 100);
});

确保在执行AJAX请求时没有替换包含实际模态窗口的容器，因为Bootstrap在尝试关闭它时将无法找到对它的引用。在Ajax完整处理程序中删除模态，然后替换数据。

如果这不起作用，你可以通过以下方法强迫它消失:

$('#your-modal-id').modal('hide');
$('body').removeClass('modal-open');
$('.modal-backdrop').remove();

确保你没有在其他地方使用相同的元素Id /类，对于一个与模态组件无关的元素。

这是. .如果你使用类名myModal来标识触发模式弹出窗口的按钮，请确保没有具有相同类名的不相关元素。