关闭另一个时打开模态的问题

Question

这是我的场景。 我有一个模态（模态 A），页脚中有 2 个按钮：保存并关闭。 当我点击“保存”按钮时，我需要关闭模态 A 并打开模态 B，它可以使用以下代码：

模态A：

<div class="modal fade" tabindex="-1" role="dialog" id="modalAddressees">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Select Addresses</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">
                [....]
            </div>
            <div class="modal-footer bg-whitesmoke br">
                <button type="button" id="saveBtn" class="btn btn-primary">Save</button>
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

Javascript：

$().ready(function () {
    $("#saveBtn").on('click', function () {
        $('#modalAddressees').modal('hide')
        $('#modalAddressees').on('hidden.bs.modal', function () {
            $('#modalNewAddress').modal('show');
        })
    });
});

但是在我关闭 Modal B 并再次打开 Modal A 之后，如果我点击关闭按钮（关闭它）它会再次打开 Modal B，为什么？ 在我的 Javascript 中，我选择仅在单击“保存”按钮时打开模式 B，而不是关闭按钮。 请问你能帮帮我吗？

这里我的测试有同样的错误： https : //jsfiddle.net/swim89/xso0jw9k/2/

谢谢 ：）

Answer 1

为了解决这个问题，我像这样改变了我的代码：

$().ready(function () {
    $("#saveBtn").on('click', function () {
        $('#modalAddressees').modal('hide');
        $('#modalNewAddress').modal('show');
    });
});

Answer 2

Javascript

$().ready(function () {
    const modalA = $('#modalAddressees');
    $("#saveBtn").on('click', function () {
        modalA.modal('hide')
        modalA.off('hidden.bs.modal').on('hidden.bs.modal', function () {
            modalA.modal('show');
        })
    });
});

或者

$().ready(function () {
    const modalA = $('#modalAddressees');
    modalA.on('hidden.bs.modal', function () {
        modalA.modal('show');
    });
    $("#saveBtn").on('click', function () {
        modalA.modal('hide');
    });
});

Answer 3

在隐藏的 bs 模态 id: modalAddAdress 上显示模态 id: modalNewAdress

$('#modalAddressees').on('hidden.bs.modal', function () {
    $('#modalNewAddress').modal('show');
 })

似乎它像你写的那样工作。