javascript - 如何在 jQuery 提交后强制硬刷新 (Internet Explorer)

Question

我正在尝试将图片上传到服务器。上传完成后，页面自动刷新。在 FF、Chrome 等中一切都很好，但在 IE 中，新页面不会用新照片更新。此行为是设计使然:http://support.microsoft.com/kb/237885

有没有办法在 jQuery.submit 之后强制硬刷新？

Answer 1

您可以将网络服务器设置为为该特定图像发出无缓存 header ；但这会影响每个请求的每个客户端，因此并不理想。

最好的解决方案是更改资源的 URL；无论是在 JavaScript 中还是在服务器上。将查询字符串添加到 URL 将足以强制刷新...例如更改:

/my_image.jpg

至

/my_image.jpg?version=2

要生成数字，您可以使用时间戳(JavaScript 中的(new Date()).getTimestamp())或随机数 (Math.random() * 1000000 )。

完整的 JavaScript 解决方案是向要刷新的图像添加一个类(例如 force-reload)，并将 src 作为 data- 属性代替；

<img class="force-reload" data-src="/my_image.jpg"/>

然后在 jQuery 中:

$(document).ready(function () {
    var now = (new Date()).getTime();

    $('img.force-reload').prop('src', function () {
        return $(this).data('src') + "?" + now;
    });
});