jquery – 用Div替换Div

前端之家收集整理的这篇文章主要介绍了jquery – 用Div替换Div前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有这个我想做的事情。我有一张地图的主图,在该地图内还有地区。这些地区有热点,所以你可以点击它们,它将只替换整个地图。 (只是一个简单的div交换)。

我需要它作为一个div,因为在这个div我有热点列出。

共有4个div,我将需要这样做。

如果有人可以帮助我,那真是太棒了!

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

  1. <tr class="thumb"></tr>
  2. <td>All Regions (shows main map) (link)</td>
  3. </tr>
  4.  
  5. <tr class="thumb"></tr>
  6. <td>Northern Region (link)</td>
  7. </tr>
  8.  
  9. <tr class="thumb"></tr>
  10. <td>Southern Region (link)</td>
  11. </tr>
  12.  
  13. <tr class="thumb"></tr>
  14. <td>Eastern Region (link)</td>
  15. </tr>
  16. </table>
  17.  
  18.  
  19. <div>All Regions image</div>
  20. <div>northern image</div>
  21. <div>southern image</div>
  22. <div>Eastern image</div>

我不能发布图像,因为我没有足够的积分,所以我知道图像链接不工作。

解决方法

你可以使用 .replaceWith()
  1. $(function() {
  2.  
  3. $(".region").click(function(e) {
  4. e.preventDefault();
  5. var content = $(this).html();
  6. $('#map').replaceWith('<div class="region">' + content + '</div>');
  7. });
  8.  
  9. });
  1. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  2.  
  3. <div id="map">
  4. <div class="region"><a href="link1">region1</a></div>
  5. <div class="region"><a href="link2">region2</a></div>
  6. <div class="region"><a href="link3">region3</a></div>
  7. </div>

猜你在找的jQuery相关文章