bootstrap，模态对话框，shown.bs.modal事件不会触发 [英] bootstrap, modal dialogs, shown.bs.modal event doesn't fire

问题描述

我正在使用带远程选项的模态对话框：

I'm using modal dialog with remote option:

<a target="profile-banner" data-target="#edit-slide-dlg" href="/Banner/SlideEditModal/1/1"
data-toggle="modal" class="banner-slide-control">Edit</a>

其中：

<div id="edit-slide-dlg" class="modal fade" tabindex="-1"></div>

另外，我正在监听使用event.target属性的shown.bs.modal事件：

Also, I'm listening for shown.bs.modal event where I use event.target property:

$("body").on("shown.bs.modal", function (event) {
  // do something with event.target 
}

某些原因导致此事件未被触发我第一次打开对话框。它只是第二次被触发。我试图浏览bootstrap脚本并找到这段代码（见我的评论）：

Some reason this event is not fired when I open dialog for the first time. And it gets fired for the second time only. I tried to browse bootstrap scripts and found this code (see my comment):

var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
transition ?
that.$element.find('.modal-dialog') // wait for modal to slide in
   .one($.support.transition.end, function () {
      that.$element.focus().trigger(e) //THIS LINE NEVER EXECUTED AT FIRST DIALOG OPENING
   })
   .emulateTransitionEnd(300) :
that.$element.focus().trigger(e)

所以，我关闭过渡作为解决方法，它使事件成为第一次被解雇，但是，event.target是空字符串。第二次，event.target包含适当的对话框HTML。这是我的代码或引导程序的问题吗？

So, I turned off transition as a workaround, It made event be fired for the first time, but, event.target is empty string. For the second time event.target contains appropriate dialog HTML. Is this problem with my code or bootstrap?

推荐答案

我有完全相同的问题。我可以使用此StackOverflow问题的解决方案来修复它： Bootstrap模态'已加载'事件在远程片段上

I had the exact same Problem. I could fix it with the solution to this StackOverflow question: Bootstrap modal 'loaded' event on remote fragment

基本上你必须手动打开模态并自己实现Ajax加载。类似于：

Basically you have to open the modal manually and implement the Ajax loading yourself. Something like:

$modal.modal({
    'show': true
}).load('/Banner/SlideEditModal/1/1', function (e) {
    // this is executed when the content has loaded.
});

这篇关于bootstrap，模态对话框，shown.bs.modal事件不会触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！