获取页面片段时以引导模式加载脚本

Question

我目前正在获取页面片段并以引导模式加载。

此页面片段包含加载 Google 地图所需的 jQuery，但当模式加载内容时，所有脚本都会被剥离，因此随后地图无法加载。

即使我直接在 modal-body 类中插入脚本，它们仍然会被剥离。

有解决办法吗？

我们目前用来触发模态的是：-

<a href="/stores .topclass" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>

如果需要准确回答，我可以提供更多正在使用的代码。

=== 编辑：根据要求提供更多正在使用的代码...

因此，我们包含了一个触发引导模式的站点范围的链接。上面可以看到触发modal的链接和here is the rest of the code in relation the modal。

我们希望在模态中加载的只是/stores处的页面片段，在此URL处加载的所有代码都可以看到here。但是，从这个页面开始，我们只希望在第 192 行加载 .modal-container 内的所有内容，但由于必要的脚本位于该 div 之外的同一文件中，因此当我们尝试以模态加载时，我们没有捕获到这一点。所以之前，我们的模态触发器看起来像：-

<a href="/stores .modal-container" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>

这导致我们尝试将整个文件内容包装在 div 中，并将其内容称为模态页面的片段，以便我们可以提取加载 #map_canvas 所需的必要脚本，但可惜的是，所有脚本都被剥离了模态...

希望这能更好地解释我们正在努力实现的目标。

=== 编辑 2：我们实际上已经通过解决方法解决了这个问题，但这是一项艰巨的工作，所以我会尽快发布答案...

Answer 1

我正在使用以下代码在 boostrap modal 上加载视图：

 $('[data-toggle="modal"]').click(function(e) {
            e.preventDefault();
            var url = $(this).attr('href');
            if (url.indexOf('#') == 0) {
                $(url).modal('open');
            } else {
                $.get(url, function(data) {
                    $(data).modal();
                }).success(function() { $('input:text:visible:first').focus(); });
            }
        });

使用以下触发器：

<a href="new" role="button" data-backdrop="static" data-keyboard="false" class="btn btn-success" rel="tooltip" data-placement="top" title="text here" data-toggle="modal" alt="text here"><i class="icon-plus icon-white"></i> </a>

通过使用此方法，您将确保在显示模式时加载所有脚本。这只是我发现正确显示我的模态的这个解决方法。

我必须在表单 (new.html) 上显示的所有内容都会完美显示。

因此，我建议您将所有相关代码放在/stores对应的页面上的Google Map。

编辑 你的触发器应该是：

<a href="/stores" class="topclass" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>

而不是：

<a href="/stores .topclass" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>`

编辑2

我看到的问题是，您的模态包含没有获取 JS 文件，因为这些文件不在您的包含部分中。我不是 PHP 专家，但您可以尝试以下选项：

选项1（不是很干净）

您可以在<div class="modal-container"></div> 中添加<script>Google Map required JS File</script> 标签，但您会得到同一个JS 文件的重复标签。

选项2（可能吗？）

创建新文件并在<div class="modal-container"></div> 部分添加您所需的JS 文件。

通过包含您的新文件来替换第 192 行，并通过传递您当前的商店对象来调用您的模式，以便在模式中显示您的信息。

如果有帮助，请告诉我。

Answer 2

StackOverflow 是否更改了您的代码？

<a href="/stores .topclass" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>

你在href中有类名吗？这可能是问题的一部分。