堆叠另一个模态后无法滚动长模态答案

【问题标题】：Unable to scroll long modal after stack another modal堆叠另一个模态后无法滚动长模态
【发布时间】：2015-05-07 03:38:53
【问题描述】：

我必须模态，模态 1 很长，它首先打开，当它出现时我可以轻松滚动页面，模态 2 很短，但是当我堆叠打开模态 2 时（当模态 1 仍然打开时打开模态 2）和然后关闭模态2：模态1不能再滚动。我试图隐藏模型 1，然后在隐藏模式 2 时再次显示它，但它没有帮助

$('#modal2').on('hide.bs.modal', function () {
   $("#modal1").modal('show');
});

【问题讨论】：

标签： twitter-bootstrap twitter-bootstrap-3 modal-dialog bootstrap-modal

【解决方案1】：

好的，经过挖掘，我发现了一个 hack，在这里发布，以便任何有相同问题的人都可以解决。

            $('body').on('hidden.bs.modal', function (e) {
                if($('.modal').hasClass('in')) {
                    $('body').addClass('modal-open');
                }    
            });

【讨论】：

请注意 - 无需使用特定模式的 ID# 修改上面的代码 - 只需按原样运行即可。
感谢@SteveFrench 的澄清。是的，此代码适用于一般情况。

【解决方案2】：

简单的答案是 Bootstrap 不支持重叠模式。来自their documentation，第一个警告说；

不支持重叠模态

请确保不要打开模态，而另一个仍然可见。一次显示多个模态需要自定义代码。

这很可能是他们不推荐它的原因之一。如果没有充分的理由，我个人不会推荐堆叠模式，可能有更好的方法来做你想做的事情，例如，你可以在打开第二个之前简单地以编程方式关闭第一个模式，你可以改变你的内容第一个动态模式，您可以在模式等中使用选项卡。

您似乎说在打开第二个模态之前已经关闭了第一个模态。也许您可以在这一点上进行扩展，因为很明显 Bootstrap 不支持或不推荐开箱即用的堆叠模式。

【讨论】：

【解决方案3】：

@Thinh Hoang Nhu 的 hack 对我不起作用，但他走在了正确的轨道上。如果有人偶然发现同样的问题，我的解决方案是向第二个模态添加一个类（我知道我在打开第一个另一个模态后打开的那些）并添加了这个功能，并稍有延迟。

$('body').on('hide.bs.modal', '.modal2nd', function () {
    setTimeout(function(){
        $('body').addClass('modal-open');
    }, 500);
});

这对我有用。

【讨论】：