我正在使用Twitter引导模态对话框。当我点击引导模式对话框的提交按钮时，它会发送一个AJAX请求。我的问题是情态背景并没有消失。模态对话框确实消失了，但是“模态背景”在屏幕上创建的不透明度仍然存在
我该怎么办?
当前回答
//Create modal appending on body
myModalBackup = null;
$('#myModal').on('hidden.bs.modal', function(){
$('body').append(myModalBackup.clone());
myModalBackup = null;
});
//Destroy, clone and show modal
myModalBackup = $('#myModal').clone();
myModalBackup.find('.modal-backdrop').remove();
$('#myModal').modal('hide').remove();
myModalBackup.find('.info1').html('customize element <b>1</b>...');
myModalBackup.find('.info2').html('customize element <b>2</b>...');
myModalBackup.modal('show');
提琴——> https://jsfiddle.net/o6th7t1x/4/
其他回答
甚至我也遇到了类似的问题，我有以下两个按钮
<button id="confirm-delete-btn" >Yes, Delete this note.</button>
<button id="confirm-delete-cancel" data-dismiss="modal">No</button>
我想执行一些ajax操作和成功的ajax操作关闭模式。这就是我所做的。
$.ajax({
url: '/ABC/Delete/' + self.model.get("Id")
, type: 'DELETE'
, success: function () {
setTimeout(function () {
self.$("#confirm-delete-cancel").trigger("click");
}, 1200);
}
, error: function () {}
});
我触发了“No”按钮的点击事件，该按钮具有data-dismiss="modal"属性。这是有效的:)
如果您正在使用从getboostrap站点本身复制并粘贴到html生成的选择器中，请确保您删除了注释'<!——/。模态——>”。Bootstrap会感到困惑，认为注释是第二个模态元素。它为这个“第二个”元素创建了另一个背景。
这个问题的另一个观点。 (我使用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"特性。
如果你遇到和我一样的问题，希望这能对你有所帮助。
另一个可能导致这个问题的错误，
确保你没有在页面中不止一次地包含bootstrap.js脚本!
模式(’hide’)
手动隐藏模式。在modal实际被隐藏之前(即在hidden.bs.modal事件发生之前)返回给调用者。
所以与其
$('#myModal').modal('hide');
$('#someOtherSelector').trigger('click');
do
$('#myModal').modal('hide');
$('#myModal').on('hidden.bs.modal', function() {
$('#someOtherSelector').trigger('click');
});
因此，您一定要等到“hide”事件完成。
