小编典典

在jQuery中上传ajax文件后,是否可以刷新图像?

ajax

我在页面上有一张图片。我正在使用AJAX表单插件上传单个图片,并且在图片上传之后,我想刷新页面上已经存在的图片。

$("#profilePicForm").ajaxForm(function() { 
    alert("Photo updated");
    $("#newPhotoForm").slideToggle();
    $("#profilePic img").load(function() {
        $(this).hide();
        $(this).fadeIn('slow');
    }).attr('src', '/Content/UsrImg/Profiles/PhotoName.jpg');
});

新上传的文件与旧文件的名称相同,所需要的只是一种刷新图像的方法。由于名称相同,因此缓存已成为一种障碍-
本文中介绍方法无效

有任何想法吗?


阅读 275

收藏
2020-07-26

共1个答案

小编典典

您链接的文章在这里不起作用,但是您可以使用图像上的查询字符串来中断缓存,如下所示:

$("#profilePicForm").ajaxForm(function() { 
  alert("Photo updated");
  $("#newPhotoForm").slideToggle();
  $("#profilePic img").load(function() {
    $(this).hide();
    $(this).fadeIn('slow');
  }).attr('src', '/Content/UsrImg/Profiles/PhotoName.jpg?' + new Date().getTime());
});

这会迫使浏览器再次检查图像,因为时间戳是添加到查询字符串中的,因此每次都不同。这意味着浏览器不再能够信任缓存了,因为那是一个稍微不同的服务器请求…因此它将导致您想要的重新获取。

2020-07-26