通过图像映射链接加载Bootstrap 3模式的内容

编程问答 2022-08-13

问题描述

我正在从页面启动许多Bootstrap模式。每个模态包含在Bootstrap轮播中显示的一组图像。为了减少初始页面加载时间，我使用了another stackoverflow答案中的脚本来仅在模式打开时填充该模式。我对其进行了一些修改，以便通过单独的PHP页面填充modal-content标签而不是modal-body标签：

<script>
// Fill modal with content from link href
$("#myModal").on("show.bs.modal",function(e) {
    var link = $(e.relatedTarget);
    $(this).find(".modal-content").load(link.attr("href"));
});
</script>

这对于页面上的简单链接非常有用，如下所示：当打开模式时，使用modal-content-example.PHP填充modal-content标签：

<a href="modal-content-example.PHP" data-remote="false" data-toggle="modal" data-target="#myModal" class="btn btn-default">Launch Modal</a>

但是，我还需要使用页面上的图像映射来启动相同的模式，但是JavaScript不适用于这些模式吗？以下代码加载了链接的PHP页面，以替换现有页面，而不是使用PHP的代码填充模式的modal-content标记：

<map name="MapName">
<area shape="circle" coords="825,406,60" href="modal-content-example.PHP" data-remote="false" data-toggle="modal" data-target="#myModal">
</map>

对于使用它来处理图像地图以及普通链接的任何帮助，我们将不胜感激。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

bootstrap-modalimagemapjavascripttwitter-bootstraptwitter-bootstrap-3