Question

我目前正在尝试按类重新加载一些div：

jQuery(".avatar-wrapper").load(location.href + " .avatar-wrapper>*", "");

img {
  width: 80px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="avatar-wrapper">
  <img class="avatar" src="https://target.scene7.com/is/image/Target/GUEST_7f86ff7a-22f0-4556-997c-b6dc907a1940?wid=488&hei=488&fmt=pjpeg">
</div>

<div class="avatar-wrapper">
  <img class="avatar" src="https://target.scene7.com/is/image/Target/GUEST_7f86ff7a-22f0-4556-997c-b6dc907a1940?wid=488&hei=488&fmt=pjpeg">
</div>

我在页面上有多个具有相同类的元素，所以我希望所有元素都被重新加载，但遗憾的是它不起作用。也许我需要直接参考，但是最好的选择是一行代码。有什么想法可以解决吗？

Answer 1

jQuery的.load()将远程内容加载到页面元素中。 <img>元素没有内容，因此无法正常工作。您最好先删除所有图片，然后再用$.post()响应中的图片替换它们，例如

$.post(location.href).done(doc => {
  $('.avatar').remove()
  $(doc).find('.avatar').appendTo('#some-container-element')
})

或者，重新加载包装图像的元素

$('#some-container-element').load(`${location.href} #some-container-element`, '')

我可以用jQuery重新加载多个div吗？

1 个答案: