通过 MVC 部分视图注入时，Bootstrap 模式显示和隐藏事件不触发

Question

在 ASP.NET MVC 5 中，我有一个带有 id 的引导模式，当满足某些条件时（为简洁起见省略了条件），#modal它会作为视图的一部分加载。我在 js 文件中实现了#modal'sshown.bs.modal和hidden.bs.modal函数：main.js

到目前为止一切顺利，一切正常。但是，在不满足上述条件的情况下，模态将通过 AJAX 调用注入到视图的 HTML 中，作为局部视图的一部分。模态与之前提到的完全相同（相同的#modalid，相同的一切）。但是，这次shown.bs.modal和hidden.bs.modal函数main.js没有触发。这是为什么？

Answer 1

更改您的事件处理程序main.js：

$('#modal').on('shown.bs.modal', function (e) { ... });
$('#modal').on('hidden.bs.modal', function (e) { ... });

委派事件处理程序：

$('body').on('shown.bs.modal', '#modal', function (e) { ... });
$('body').on('hidden.bs.modal', '#modal', function (e) { ... });

您可以替换body为#modal包含在其中的任何父容器。有关详细说明，请参阅@Stephen Muecke 评论中的链接。