在页面上显示所有引导模式的事件答案

【问题标题】：Show event for all Bootstrap Modals on the page在页面上显示所有引导模式的事件
【发布时间】：2015-02-19 16:15:47
【问题描述】：

每当打开 Bootrap 模式时，我都会尝试做一些事情（在这种情况下是一些统计数据）。

我知道，我可以将这样的事件监听器添加到模态框：

$('#modal-content').on('shown.bs.modal', function() {
   alert('do something');
});

但是有没有办法让页面上的所有模式都有一个监听器？额外的问题：即使对于那些被 Javascript 插入的人？

我想过这样的事情：

jQuery('.modal[role="dialog"]').on('show.bs.modal', function() {
   alert('do something');
});

但我希望有更好的方法和适用于 Javascript 插入的模式的东西。

【问题讨论】：

【解决方案1】：

这应该对你有用——它会在事件冒泡到文档级别时捕获事件，因此应该将它们全部捕获：

$(document).on('shown.bs.modal', function() {
   alert('do something');
});

HTH, -泰德

【讨论】：

【解决方案2】：

如果您提前知道 id，您可以将它们列出来：

$('#modalOne, #modalTwo').on('shown.bs.modal', function() {
   alert('do something');
});

或者更好的是，如果您以编程方式以及在 html 中创建它们并且为 id 使用公共前缀，则可以使用以下内容：

$("div[id^='modal']").on('shown.bs.modal', function() {
   alert('do something');
});

【讨论】：