如何利用JavaScript阻止image被缓存
为何要阻止image被缓存，如何用最简单的方法来达到目地？且听我慢慢道来：
问题起因
最近做了一个配合后端ajax上传图片的模块，其运行过程如下：
- 用户点浏览后，弹出系统文件选择框。
- 用户选择图片，此时将用户选择的图片传到后台，后端返回image url
- 前端利用该url把图片显示在一个新的自定义弹窗中
- 用户可在该弹窗中对图片进行裁剪，也可以点击取消按钮不去裁剪
问题来了：当用户点击取消按钮后，重新从系统选择一张新图片，前端拿到后端返回的新image url显示到页面，页面却显示的还是上一次的旧图片。
分析及解决方案
分析后发现：利用Firebug查看页面结构时，Firebug显示的图片是最新的图片，而页面却是旧图片。把上面的场景测试了好多遍，每次都会有这样的问题。
于是我首先想到的应该是image有缓存。如果在后端返回image url后，我为image url后面加一串不同的参数然后显示到页面，这样就能保证每次的图片都是最新的了。
代码如下，很简单：
// imgUrl为后端返回的图片url
var newImgUrl = imgUrl + '?' + (new Date()).getTime();
$('img').attr('src', newImgUrl);问题解决。:)
