关闭第一层模态框后第二层模态框无法滚动

1. 问题描述

两个模态框同时显示在页面中，当希望关闭上一层模态框A，保留下一层模态框B时，出现的下一层模态框B不能上下滚动的问题。

2. 什么情况下问题出现?

我写的页面使用了 Bootstrap 模态框Modal， 这个模态框B显示的同时又弹出了另一个模态框A。 第二个模态框A使用了 bootbox的prompt 弹窗， 同理如果同时显示的是另一个模态框也会有同样的问题。

3. 问题分析

当我们显示模态框是会发现body上被添加了一个类，名为“modal-open”. 这个类会帮助浏览器了解到我们现在的页面是存在modal的。而每当我们关闭模态框时，这个类就会相应被移除。
了解这个过程后我们发现了问题，明明还有一个模态框处于show的状态，这个“modal-open”类却在关闭第一个模态框时被remove了。所以导致页面中存在于底层的模态框不能滚动了。

4. 问题解决

最后，我在上一层模态框A关闭时添加了监听事件，目的是在关闭模态框A后再将这个被移除掉的类再加回到body标签上。
a. “.bootbox-prompt” 就是我所关闭的模态框A

$(document).on("hidden.bs.modal", ".bootbox-prompt", function () {
	$("body").addClass("modal-open");
});