Bootstrap 4模态重新确认

Question

我想用Bootstrap 4创建一个“灵活的”确认对话框，因为我不想对每个确认模式/动作单独进行硬编码。

所以，使用标准模态

<div class="modal fade" tabindex="-1" role="dialog" id="msgModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="msgModalTitle">Modal title</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body" id="msgModalBody">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Doch nicht</button>
                <button type="button" class="btn btn-primary" id="btnModelConfirmMessage">OK</button>
            </div>
        </div>
    </div>
</div>

和相应的js-magic：D

function showConfirm(htmlInput,headerTxt, fun){
    $('#msgModalTitle').text(headerTxt);
    $('#msgModalBody').html(htmlInput);
    $('#msgModal').modal('show');
    $('#btnModelConfirmMessage').click(function () {
        fun();
        $('#msgModal').modal('hide');
    });
}

我认为，通过发送“动作”部分作为函数，将在单击“确定”按钮#btnModelConfirmMessage时立即执行。

像一个咒语一样工作，但是有一个重大错误。

似乎事件处理程序保持在模式上，即，如果我显示并仅隐藏模式，则“确定”按钮将触发该函数两次。

除其他外，我发现了这篇文章Bootstrap modal firing up incrementing times建议将click（）事件移到外部。我确信这可以完成该特定任务，但是我会失去功能。

那么如何使用hide.bs.modal事件解除绑定处理程序？

Answer 1

阅读了jquery-doc之后，答案很简单：