Twitter引导模式背景不会消失

我正在使用Twitter引导模态对话框。当我点击引导模式对话框的提交按钮时，它会发送一个AJAX请求。我的问题是情态背景并没有消失。模态对话框确实消失了，但是“模态背景”在屏幕上创建的不透明度仍然存在

我该怎么办?

当前回答

这个问题的另一个观点。 (我使用bootstrap.js 3.3.6版本)

我错误地在javascript中手动初始化模态:

$('#myModal').modal({
   keyboard: false
})

通过使用

模态数据-toggle = " "

在下面这个类似按钮的例子中(在文档中显示)

<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">Launch demo modal</button>

结果它创建了两个实例

<div class="modal-backdrop fade in"></div>

当打开模态时附加到我的HTML的主体。这可能是使用function关闭模态时的原因:

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

它只删除一个背景实例(如上所示)，所以背景不会消失。但如果你使用data-dismiss="modal"在html上添加，它就会消失，就像bootstrap doc中显示的那样。

所以我的问题的解决方案是只初始化模式手动在javascript和不使用数据属性，这样我可以关闭模式手动和使用data-dismiss="modal"特性。

如果你遇到和我一样的问题，希望这能对你有所帮助。

其他回答

我知道这是一个非常老的帖子，但这可能会有所帮助。这是我的一个非常小的解决办法

$('#myModal').trigger('click');

就是这样，这应该能解决问题

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

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

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

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

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

我也有同样的问题。

然而，我使用bootbox.js，所以这可能是与此有关。

不管怎样，我意识到这个问题是由一个元素与它的父类具有相同的类引起的。当其中一个元素被用来绑定一个点击函数来显示模态时，就会出现问题。

这就是问题的原因:

<div class="myElement">
    <div class="myElement">
        Click here to show modal
    </div>
</div>

更改它，以便被点击的元素不具有与其父类、任何子类或任何其他父类相同的类。通常在绑定单击函数时这样做可能是一个很好的实践。

使用切换而不是隐藏，解决了我的问题

推荐文章