Jquery 引导打开多模态问题

我有这个问题，我需要打开多个模态。好的是，在我打开一个新的模态之前，可以关闭现有的模态。 当模态正常打开时，我得到一个应用于主体的类，名为“模态打开”，该类将溢出：隐藏应用于主体

我创建了以下脚本：

var login = function () {

    var handleRegister = function () {

        $("a").click(function (e) {
            var target = $(this).data("target");

            if (target) {
                var visible = $(target).is(":visible");

                if (!visible) { 
                    $('.modal').each(function () {
                        $(this).modal('hide'); // hide existing modals
                    });

                    $(target).modal('show');
                }

                e.preventDefault();
            }
        });
    }

    return {
        init: function () {
            handleRegister();
        }
    }
}();

如您所见，我循环遍历所有现有的modal并关闭它们（我假设这将调用hidden.bs.modal，并从主体中删除modal open类），在运行这些modal之后，我在目标上调用show方法。 问题在于模态打开类未应用于车身

我尝试在show调用之后添加$（“body”）.addClass（“modal open”），但没有添加该类

---

以前有人遇到过这个问题吗？

我通过连接到模式隐藏/显示事件来解决这个问题。 我修改后的脚本如下所示：

    var login = function () {

        var handleRegister = function () {

            $("a, button").click(function (e) {
                var target = $(this).data("target");
                var type = $(this).data("type");

                if (target && type) {
                    var visible = $(target).is(":visible");

                    if (!visible) {                    
                        var available_height = $(window).height() - $('.topbar').outerHeight();
                        var content = $('.modal-content', target);
                        content.height(available_height);

                        $('.modal').each(function () {
                            $(this).modal('hide'); // hide all existing modals
                        });

                        $(target).modal('show');
                    }

                    e.preventDefault();
                }
            });

            $('.modal').on('hidden.bs.modal', function (e) {
                $("body").removeClass("modal-open");
            });

            $('.modal').on('shown.bs.modal', function (e) {
                $("body").addClass("modal-open");
            });
        }

        return {
            init: function () {
                handleRegister();
            }
        }
    }();

我不确定为什么会这样，因为我希望这是模态脚本中无论如何都会发生的事情。但是它是有效的，所以嘿，呵呵。

这是我的解决方案：

---

在打开第二个模式之前：

hasAlreadyModalOpen = $("BODY").hasClass("modal-open");
mySecondModal.modal("show");

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

---

这是一个非常古老的问题，但答案很简单，因为这在搜索结果中占有重要地位，而且仍然是一个问题。 在任何次要模态中添加一个附加类，例如

子模态

，然后连接到它们的隐藏事件，这将简单地缓解这种情况

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