Question

在此示例中，我具有Bootstrap Modals，我需要拦截其 Open / Show 事件。但是this thread中提到的建议对我来说都没有用。我想念什么吗？

我尝试了以下操作：

// Listener - Show Event Interception

    // NONE OF THE FOLLOWING WORK
        $('#modal').on('shown.bs.modal', function (e) {
            alert('Modal opened 1');
        });
        $('#modal').on('shown', function (e) {
            alert('Modal opened 2');
        });  
      $(window).on('shown.bs.modal', function() { 
          alert('Modal opened 3');
        });

我的模态如下（以$('#modal').show();打开）：

<div class="modal modal-dialog" id="modal" tabindex="-1" role="dialog"  aria-hidden="true" >  
  <div class="modal-content" style="margin:0 auto;">
     ...
  </div>
</div>

更新

眼前的问题是我正在使用show()而不是modal('show')。但是，我也尝试使用$(document).on('show', function(evt) {..}进行拦截，但失败了。

仅用于拦截jQuery show()事件的新方法：

$(document).on('show', function(evt) {
    if($(evt.target).attr('role') != null && $(evt.target).attr('role') == 'dialog') { 
       alert('Intercepted Dialog Show'); 
    }
});

Answer 1

您的小提琴通过jQuery的.show方法显示了模态，该方法实质上使隐藏的元素可见。因此，不会触发任何事件。

要触发shown.bs.modal事件以及与此事件有关的模态的任何事件，您将要使用模态方法特别是.modal('show')来相应地显示模态。

$('#opendlg').click(function() {
    $('#modal').modal('show');
});

Bootstrap Modal Show Event未被任何事件侦听器拦截

更新

1 个答案: