我正在尝试做这件事。我有一张 map 的主要图片,并且该 map 内有区域。这些区域上有热点,因此您可以单击它们,它将仅用该区域替换整个 map 。 (只是一个简单的div交换)。

我需要将其作为div,因为在此div中,我列出了热点。

我将需要总共使用4个div

如果有人可以帮助我,那就太好了!

因此,表中列出的链接需要替换单独的div中的图像。

<tr class="thumb"></tr>
<td>All Regions (shows main map) (link)</td>
</tr>

<tr class="thumb"></tr>
<td>Northern Region (link)</td>
</tr>

<tr class="thumb"></tr>
<td>Southern Region (link)</td>
</tr>

<tr class="thumb"></tr>
<td>Eastern Region (link)</td>
</tr>
</table>


<div>All Regions image</div>
<div>northern image</div>
<div>southern image</div>
<div>Eastern image</div>

由于我没有足够的积分,因此我无法发布图像,因此我知道图像链接无法正常工作。

最佳答案

您可以使用 .replaceWith()

$(function() {

  $(".region").click(function(e) {
    e.preventDefault();
    var content = $(this).html();
    $('#map').replaceWith('<div class="region">' + content + '</div>');
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="map">
  <div class="region"><a href="link1">region1</a></div>
  <div class="region"><a href="link2">region2</a></div>
  <div class="region"><a href="link3">region3</a></div>
</div>

关于jquery - 用另一个Div替换Div,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/5062916/

10-11 22:48
查看更多