使用 javascript 加载图像不会在图像更改时更新答案

【问题标题】：Loading images with javascript doesn't update on image change使用 javascript 加载图像不会在图像更改时更新
【发布时间】：2012-02-29 13:06:31
【问题描述】：

我在使用 wamp 时遇到了一些问题，当我编辑（在外部程序中）我用 javascript 加载的图像时，它不会在网络服务器上更新。

我正在使用此代码将图像加载为 h2 标签的背景

$('div.drawer h2').each(function(index)
{
    $(this).css("background-image", "url(./images/" + $(this).text() + ".png)")
});

这会从图像文件夹中加载带有 h2 +.png 文本的图像

但是它不会在缓存中重新加载图像，所以如果我编辑源图像，它不会在网页上更改。

如果我在 CSS 中加载图像（使用 background-image 变量），它会很好地加载和更新。

如何解决此问题？这是预期的吗？

【问题讨论】：

【解决方案1】：

图片可能缓存在您的网络浏览器中，请尝试按 ctrl+F5 重新加载它。

或者你可以试试ctrl+delete删除浏览器的整个缓存看看是不是你的问题。

如果在javascript中动态加载图片，可以在图片名称后添加?randomnumber。

像http://yourserver/imageName.jpg?1234 这样每个请求的 URL 都是唯一的，因此不会访问浏览器的缓存。

【讨论】：