模态对话框不会随 stopPropagation 关闭

Posted 2023-05-08

【中文标题】模态对话框不会随 stopPropagation 关闭

【英文标题】：Modal Dialog box does not close with stopPropogation

【发布时间】：2020-05-19 11:04:03

【问题描述】：

我有以下对话框：

<div class="modal fade PSettings" id="ModalMsg" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-body">
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
    </div>
</div>

这是我的 jquery 代码：

    $(".btn").click(function (evt) 

    var wID = $('#MPID :selected').val();

    if (wID.length == 0) 

      evt.preventDefault();

      $('#ModalMsg .modal-body').html('<p><b>Please select a valid name from the drop down list.</b></p>');

      $('#ModalMsg').modal(
        backdrop: 'static',
        keyboard: false,
        show: true
      );

      evt.stopPropagation();

    
);

我遇到的问题是我喜欢显示对话框并且能够让用户单击关闭按钮。当用户点击关闭按钮时没有任何反应。

单击关闭按钮后，我喜欢停止传播，因为单击按钮会触发另一个动作。

【问题讨论】：

停止传播会阻止它冒泡而不是停止其他事件处理程序

@freedomn-m 谢谢。如何阻止另一个事件继续进行。

【参考方案1】：

如果您只想控制隐藏/显示模式事件，我认为您不需要对所有事件/侦听器进行操作。对模态使用“hide.bs.modal”事件。它会触发您尝试关闭模态的时间。在这个函数中返回 true 或 false 将启用或禁用关闭模式。

$(".modal").on("hide.bs.modal", function()
    return false; // you should return true if you want to close dialog, otherwise you should return false 
                // so change 'false' in my example to your conditions
);