更改img.src后強制Firefox重新加載圖像

Question

我正在修改畫布上的某些圖像，然后將此圖像的src設置為新的base64編碼圖片。

img.src = changeColor(img);

changeColor返回base64編碼的圖像：

return canvas.toDataURL();

更改src后，Chrome和Opera會刷新圖像，但是Firefox不會！ 我還檢查了FireBug的圖像元素，它顯示了新的src和新圖像！

我已經嘗試過將數據添加到URL，但是……這是base64編碼的圖像，而不是URL，因此它完全破壞了我的圖片。

我有什么辦法可以通過JavaScript強制重新加載圖像或禁用Firefox緩存？

更新：我也試圖設置image.src =''; 在changeColor函數中。 它在chrome中有效，但在Firefox中...圖片消失了，當我設置新的base64值時不再出現。

Answer 1

如@dmmd所述，它為我工作。 您只需要添加具有隨機值的查詢字符串。

id.src = "path?t=t"+ Math.random(5);

Answer 2

我沒有使用圖像數據，但是這適用於類似的問題，即當src變量不變時，FF無法重新加載：

image.src = "";
setTimeout(function(){
    image.src = //the new image src
}, 0);

Answer 3

嘗試添加圖像格式（並使用jpg）。 它可能會重新編碼圖像：

return canvas.toDataURL('image/jpg');