将函数绑定到 Twitter Bootstrap 模式关闭

引导程序 3 和 4

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

引导程序 3：getbootstrap.com/javascript/#modals-events

引导程序 4：getbootstrap.com/docs/4.1/components/modal/#events

引导程序 2.3.2

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

请参阅 getbootstrap.com/2.3.2/javascript.html#modals → 事件

---

引导程序 4

$('#my-modal').on('hidden.bs.modal', function () {
  window.alert('hidden event fired!');
});

有关工作示例，请参阅此 JSFiddle：

https://jsfiddle.net/6n7bg2c9/

请参阅此处文档的模态事件部分：

https://getbootstrap.com/docs/4.3/components/modal/#events

---

启动 Bootstrap 3（编辑：在 Bootstrap 4 中仍然相同）有 2 个实例可以触发事件，它们是：

1.当模态“隐藏”事件开始时

$('#myModal').on('hide.bs.modal', function () { 
    console.log('Fired at start of hide event!');
});  

2.当模态“隐藏”事件完成时

$('#myModal').on('hidden.bs.modal', function () {
    console.log('Fired when hide event has finished!');
});

参考：http://getbootstrap.com/javascript/#js-events

---

您需要使用“on”事件而不是“live”，但将其分配给文档对象：

利用：

$(document).on('hidden.bs.modal', '#Control_id', function (event) {
// code to run on closing
});

---

$(document.body).on('hidden.bs.modal', function () {
    $('#myModal').removeData('bs.modal')
});

---

Bootstrap 提供您可以挂接到 modal 的事件，例如，如果您想在模式对用户隐藏完毕后触发 event，您可以使用 hidden.bs.modal 事件像这样

    /* hidden.bs.modal event example */
    $('#myModal').on('hidden.bs.modal', function () {
          window.alert('hidden event fired!');
    })

在 Documentation 中查看有效的fiddle here，了解有关模态方法和事件的更多信息

---

引导程序 5+ #ES6+

更少的依赖 -> 像其他框架一样，由于新的事件方法，Bootstrap 将回到标准

var myModalEl = document.getElementById('myModalID');
myModalEl.addEventListener('hidden.bs.modal', function (event) {
    // do something...
});

有关工作示例，请参阅此 JSFiddle：

https://jsfiddle.net/Metamagikum/cw5f76bp/3/

官方文档位于此处：

https://getbootstrap.com/docs/5.0/components/modal/

---

引导程序 4：

$('#myModal').on('hidden.bs.modal', function (e) {
   // call your method
})

hide.bs.modal：当调用 hide 实例方法时立即触发此事件。

hidden.bs.modal：当模式对用户完成隐藏时触发此事件（将等待 CSS 转换完成）。

---

我会这样做：

$('body').on('hidden.bs.modal', '#myModal', function(){ //this call your method });

其余的已经被别人写了。我还建议阅读文档：jquery - on method

---

我已经看到很多关于引导事件的答案，例如当模式关闭时触发的 hide.bs.modal。

这些事件存在问题：模式中的任何弹出窗口（弹出框、工具提示等）都会触发该事件。

当模态关闭时，还有另一种方法可以捕获事件。

$(document).on('hidden','#modal:not(.in)', function(){} );

当模式打开时，Bootstrap 使用 in 类。使用 hidden 事件非常重要，因为在触发事件 hide 时仍然定义类 in。

此解决方案在 IE8 中不起作用，因为 IE8 不支持 Jquery :not() 选择器。

---

如果你想在每个模态关闭时触发一个函数，你可以使用这个方法，

$(document).ready(function (){
    $('.modal').each(function (){
        $(this).on('hidden.bs.modal', function () {
            //fires when evey popup close. Ex. resetModal();
        });
    });
});

所以你不需要每次都指定模态ID。

---

我和一些人有同样的问题

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

您需要将其放在页面底部，将其放在顶部永远不会触发事件。

---