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

我该怎么办?


当前回答

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

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

<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);
});

其他回答

updatepanel issue。

我的问题是由于更新面板的位置。我在更新面板上有整个模式。如果你在更新面板之外声明了模态在更新面板中只有模态主体,那么 $ (' # myModalID ') .modal(隐藏的); 工作。

甚至我也遇到了类似的问题,我有以下两个按钮

<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"属性。这是有效的:)

在动作按钮中插入:

data-backdrop="false"

and

data-dismiss="modal" 

例子:

<button type="button" class="btn btn-default" data-dismiss="modal">Done</button>

<button type="button" class="btn btn-danger danger" data-dismiss="modal" data-backdrop="false">Action</button>

如果你输入这个data-attr, .modal- background将不会出现。 关于它的文档在这个链接:http://getbootstrap.com/javascript/#modals-usage

$ (' # myModal ') .trigger(“点击”);

这对我很管用。它没有关闭,因为当你打开弹出窗口时,它会触发2或3个模式背景。当你执行$('#myModal')).modal('hide');它只影响一个情态-背景和其余的。

这个问题也会发生,如果你隐藏,然后再次显示模式窗口太快。这一点在其他地方提到过,但我将在下面提供更多细节。

这个问题与时间和渐变过渡有关。如果你在前一个模式的淡出过渡完成之前显示了一个模式,你会看到这个持续的背景问题(模式背景会以你的方式留在屏幕上)。Bootstrap显式地不支持多个同时的模态,但这似乎是一个问题,即使你隐藏的模态和你显示的模态是相同的。

如果这是你的问题的正确原因,这里有一些缓解问题的选择。选项#1是一个快速而简单的测试,可以确定渐隐过渡时间是否确实是问题的原因。

禁用模态的Fade动画(从对话框中删除Fade类) 更新模态的文本,而不是隐藏并重新显示它。 修正时间,使它不会显示模态,直到它完成隐藏前一个模态。使用模态的事件来做到这一点。http://getbootstrap.com/javascript/#modals-events

这里有一些相关的引导问题跟踪帖子。追踪者的帖子可能比我下面列出的要多。

https://github.com/twbs/bootstrap/issues/735 https://github.com/twbs/bootstrap/issues/2839 https://github.com/twbs/bootstrap/issues/19385