我正在使用Twitter引导模态对话框。当我点击引导模式对话框的提交按钮时，它会发送一个AJAX请求。我的问题是情态背景并没有消失。模态对话框确实消失了，但是“模态背景”在屏幕上创建的不透明度仍然存在
我该怎么办?
当前回答
对我来说，最好的答案是。
<body>
<!-- All other HTML -->
<div>
...
</div>
<!-- Modal -->
<div class="modal fade" id="myModal">
...
</div>
模式标记放置 始终尝试将模态的HTML代码放在文档的顶层位置，以避免其他组件影响模态的外观和/或功能。
从这个SO答案
其他回答
我也有同样的问题。我发现这是由于Bootstrap和JQueryUI之间的冲突。
两者都使用“close”类。改变其中一个类可以解决这个问题。
使用切换而不是隐藏，解决了我的问题
我有模态背景屏幕冻结的问题，但在一个略有不同的场景:当2个背靠背的模态正在显示。例:第一个模式会要求确认做某事，点击“确认”按钮后，动作会遇到错误，第二个模式将显示弹出错误消息。第二模态背景会冻结屏幕。 元素的类名或id没有冲突。
解决这个问题的方法是给浏览器足够的时间来处理模式背景。而不是在点击“确认”后立即采取行动，给浏览器500ms来隐藏第一个模式和清理背景等-然后采取行动，最终显示错误模式。
<button type="button" class="btn btn-red" data-dismiss="modal" on-tap="_dialogConfirmed">Confirm</button>
...
_dialogConfirmed()函数的代码如下:
var that = this;
setTimeout(function () {
if (that.confirmAction) {
(that.confirmAction)();
that.confirmAction = undefined;
}
}, 500);
我猜其他解决方案之所以有效，是因为它们花费了足够的额外时间，让浏览器有足够的清理时间。
我只是在这个问题上花了太多时间:)
虽然提供的其他答案是有帮助的和有效的，但对我来说，从Bootstrap有效地重新创建模态隐藏功能似乎有点混乱，所以我找到了一个更干净的解决方案。
问题是，当你打电话时，会发生一连串的事件
$("#myModal").modal('hide');
functionThatEndsUpDestroyingTheDOM()
然后，当您替换AJAX请求的结果一堆HTML时，模式隐藏事件不会结束。然而，Bootstrap在一切完成时触发一个事件，你可以像这样钩入:
$("#myModal").modal('hide').on('hidden.bs.modal', functionThatEndsUpDestroyingTheDOM);
希望这对你有帮助!
这个解决方案适用于Ruby on Rails 3。X和一个js。erb文件重建部分DOM，包括模态。不管ajax调用是来自模态还是来自页面的不同部分，它都能正常工作。
if ($("#my-modal").attr("aria-hidden") === "false") {
$("#my-modal").modal('hide').on('hidden.bs.modal', function (event) {
functionThatEndsUpDestroyingTheDOM();
});
} else {
functionThatEndsUpDestroyingTheDOM();
}
感谢@BillHuertas的出发点。
