我正在使用Twitter引导模态对话框。当我点击引导模式对话框的提交按钮时,它会发送一个AJAX请求。我的问题是情态背景并没有消失。模态对话框确实消失了,但是“模态背景”在屏幕上创建的不透明度仍然存在
我该怎么办?
我正在使用Twitter引导模态对话框。当我点击引导模式对话框的提交按钮时,它会发送一个AJAX请求。我的问题是情态背景并没有消失。模态对话框确实消失了,但是“模态背景”在屏幕上创建的不透明度仍然存在
我该怎么办?
当前回答
使用切换而不是隐藏,解决了我的问题
其他回答
甚至我也遇到了类似的问题,我有以下两个按钮
<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"属性。这是有效的:)
use:
$('.modal.in').modal('hide')
源
我正在和流星一起工作,我也遇到了同样的问题。我的bug的原因是:
{{#if tourmanager}}
{{>contactInformation tourmanager}}
{{else}}
<a href="#addArtistTourmanagerModal" data-toggle="modal"><i class="fa fa-plus"></i> Tourmanager toevoegen</a>
{{>addArtistTourmanagerModal}}
{{/if}}
正如你所看到的,我在else中添加了模态,所以当我的模态更新联系人信息时,if有另一个状态。这导致模态模板在DOM即将关闭之前被排除在外。
解决方案:将模态移出if-else:
{{#if tourmanager}}
{{>contactInformation tourmanager}}
{{else}}
<a href="#addArtistTourmanagerModal" data-toggle="modal"><i class="fa fa-plus"></i> Tourmanager toevoegen</a>
{{>addArtistTourmanagerModal}}
{{/if}}
我也遇到过类似的问题:在我的模式窗口中,我有两个按钮,“取消”和“确定”。最初,这两个按钮都将通过调用$('#myModal').modal('hide')来关闭模式窗口(前面有"OK"执行一些代码),场景如下:
打开模态窗口 做一些操作,然后点击“确定”是否验证他们并关闭模式 再次打开模态并通过点击“取消”来取消 重新打开模式,再次点击“取消”==>背景不再可访问!
好吧,我旁边的同事帮了我大忙:不用调用$('#myModal').modal('hide'),而是给你的按钮赋予data-dismiss="modal"属性,并在你的"Submit"按钮中添加一个"click"事件。在我的问题中,按钮的HTML(好吧,TWIG)代码是:
<button id="modal-btn-ok" class="btn" data-dismiss="modal">OK</button>
<button id="modal-btn-cancel" class="btn" data-dismiss="modal">Cancel</button>
在我的JavaScript代码,我有:
$("#modal-btn-ok").one("click", null, null, function(){
// My stuff to be done
});
而没有“点击”事件归因于“取消”按钮。模态现在正确关闭,让我再次使用“正常”页面。实际上,似乎data-dismiss="modal"应该是指示按钮(或任何DOM元素)应该关闭Bootstrap模式的唯一方法。modal('hide')方法的行为似乎不太可控。
希望这能有所帮助!
模式(’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”事件完成。