我正在使用 twitter bootstrap 在两个单独的选项卡中制作一个包含地图(谷歌地图)的网络应用程序。我试图找出一种方法来拥有一个可以在两个选项卡中显示的实际画布,每个选项卡具有不同的尺寸。我能想到的最简单的方法是只拥有 2 张地图,并在发生变化时在每张地图上运行相同的更新。我不喜欢那样做的想法。每个选项卡使用地图的方式略有不同,但应该是相同的地图。
有没有办法将 div 的内容“绑定”到另一个 div?
这是一个简单的代码示例来解释我在做什么:
<ul class="nav nav-tabs">
<li><a href="#map1-content" data-toggle="tab">Map1</a></li>
<li><a href="#map2-content" data-toggle="tab">Map2</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane" id="map1-content">(I want to display map canvas here)</div>
<div class="tab-pane active" id="map2-content">(and I also want to put it here with this div's styling)</div>
</div>
<div id="map-canvas"></div>