javascript - jQuery 在 src 上附加带有 url 的 img 元素在 IE 和 FF 中不起作用

Question

我有一个通过 url 检索 src 的图像标签，例如:

<img src="http://localhost:2000/User/GetImage/1" />

该元素由 jQuery 生成，即:

this.updateImage  = function() 
{
    console.log("Change me!");
    var context = this;
    var imageSrc = webApiUrl + "User/GetImage/" + this._id;

    $("#ga-application-header .user-info-image").each(function()
    {
        $(this).empty();
        /* First try */$(this).append($("<img title='" + context._firstName + " " + context._lastName + "' />").attr("src", imageSrc));
        /* Second try*/$(this).append("<img title='" + context._firstName + " " + context._lastName + "' src='" + imageSrc + "' />");
    });
}

带有注释的行 - 第一次和第二次尝试 - 是我尝试实现此目标的方式。

现在是最重要的细节。加载页面时，将调用此函数并显示图像。这行得通。但是如果我再次调用它(当用户更改它的图片时)图像不会在 IE 和 FF 中显示。仅在 Chrome 上。 IE 和 FF 甚至不为其打开图像请求(在控制台的网络选项卡上)。请注意 console.log文本“改变我!”总是被调用。

Answer 1

问题是由浏览器缓存图像引起的。解决方法是将随机查询字符串附加到图像源。