Twitter Bootstrap Modal - On hidden

Question

我目前正在开发Bootstrap，以便在模式中放置视频。一切都是通过cms生成的(所以我不能控制有多少视频将被显示。)

一切都很顺利(我必须为每个模式提供自己的ID，这样一切都可以正常工作)。问题是，当您关闭模式并运行视频时，视频(和声音)将继续在后台运行。

为了避免这种情况，当模式使用x按钮关闭时，我刷新了模式中的html，如下所示：

$('button.close').click(function(){
    var divcible=$(this).parent().parent().find(".modal-body");
    var html = divcible.html()
    divcible.html("")
    divcible.html(html)
})

我的问题是，如果用户点击背景，Html就不会重置。在boostrap的网站上他们称之为

$('#myModal').on('hidden', function () {
  // do something…
})

来监控一个模式何时关闭，但我想知道是否有一种方法可以监控任何模式何时关闭。

Answer 1

在你的模态中添加一个类，并使用：

$('.myModal').on('hidden', function () {
   // do something…

   // edit for clarity: "that" will now reference the modal that was hidden
   var that = this;          
})

Answer 2

$('#myModal').on('hidden.bs.modal', function (e) {
  // do something...
})

来自bootstrap 3.x文档http://getbootstrap.com/javascript/#modals

Answer 3

默认情况下，大多数事件从原始事件目标bubble up到document元素。这也是hidden事件的情况，该事件在完成对用户隐藏模态后触发。因此，监视任何模式何时关闭的一种方法是将事件处理程序附加到document元素，如下所示：

$(document).on('hidden', function () {
  // a modal closes, so do what you want :)
})