模态对话框不会用 stopPropagation 关闭

Question

我有以下对话框：

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

    }
});

我运行遇到的问题是我喜欢显示对话框并允许用户单击“关闭”按钮。当用户点击关闭按钮时没有任何反应。

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

Answer 1

我认为如果您只想控制 hide/show 模态事件，则不需要对所有 events/listeners 进行操作。使用 '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
});

模态对话框不会用 stopPropagation 关闭

Modal Dialog box does not close with stopPropogation

jquery

modal-dialog

twitter-bootstrap