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

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>Java脚本：$().ready(function () {    $("#saveBtn").on('click', function () {        $('#modalAddressees').modal('hide')        $('#modalAddressees').on('hidden.bs.modal', function () {            $('#modalNewAddress').modal('show');        })    });});但是在我关闭模态 B 并再次打开模态 A 之后，如果我单击关闭按钮（关闭它）它会再次打开模态 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

在隐藏的 bs 模态 id: modalAddAddress 显示模态 id: modalNewAddress

$('#modalAddressees').on('hidden.bs.modal', function () {

    $('#modalNewAddress').modal('show');

 })

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

Answer 3

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

    });

});