引导模式和内联脚本答案

【问题标题】：Bootstrap modal and inline scripts引导模式和内联脚本
【发布时间】：2016-09-15 04:05:18
【问题描述】：

我有一个脚本可以将页面内容动态加载到 bootstrap 3 模式中。这是一些小sn-p：

var modal = $('#my-modal');
var modalContent = modal.find('.modal-content');

modalContent.load(url, data, function () {
    modal.modal(options);
});

这很好用，除非我需要从加载的页面运行内联 js 脚本，并用 <script> 标签包裹。实际上，它会执行一次，但每秒钟执行一次。这意味着如果我有按钮来打开带有一些注释的模式，当我按下按钮时它将打开模式，并执行脚本。如果我关闭模式，然后重新打开它，它不会。再次，关闭并重新打开...工作...

即使我在再次初始化之前完全破坏了模态，也没有工作，我仍然有同样的问题。

var modal = $('#my-modal');
var modalContent = modal.find('.modal-content');

modalContent.load(url, data, function () {
    modal.modal('hide').data('bs.modal',null);
    modal.modal(options);
});

编辑：如果我将相同的加载内容放入任何其他 div，它就可以正常工作！

【问题讨论】：

正在加载的脚本到底是什么？您是否正在添加事件处理程序等？您是否多次重新定义相同的功能？
@DelightedD0D 无论脚本中有什么，即使是简单的 console.log()。当我将加载的内容渲染到模式之外的任何其他 div 中时，它按预期工作

标签： javascript jquery twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

仍然不确定是什么导致了这个问题，但这里是解决它的方法。每次关闭模态时，我都会清除模态内容 div，因此在加载新内容时，它始终会加载到空的模态内容 div 中。

这是初始化模态函数的脚本：

modal = $('#my-modal');
modal.on('hidden.bs.modal', function () {
    modal.find('.modal-content').empty();
});

【讨论】：