JavaScript如何取消下载图像

我举一个谷歌地图的例子，我们放大谷歌地图发送新的地图图片，但我的项目中的问题是我使用了一次缩放，这很好，因为加载了新的图像，但我使用了两个或更多的缩放，举个例子，如果我缩放三倍非常快：我的浏览器使队列先下载第一次缩放图像，第二个下载第二个缩放图像，第三个下载第三个缩放图像，但我只需要下载第三个缩放图像

也许有人可以建议你试试

加载图像脚本示例：

var imageURLs=[];  
imageURLs.push('https://developer.chrome.com/webstore/images/calendar.png');
imageURLs.push('http://www.w3schools.com/html/html5.gif');
imageURLs.push('http://www.linosartele.lt/wp-content/uploads/2014/08/images-9.jpg');

var imgs=[];
var imagesOK=0;
loadAllImages(start);

function loadAllImages(callback){
    for (var i=0; i<imageURLs.length; i++) {
        var img = new Image();
        imgs.push(img);
        img.onload = function(){ 
            imagesOK++; 
            if (imagesOK>=imageURLs.length ) {
                callback();
            }
        };
        img.src = imageURLs[i];
    }      
}

function start(){

    bgCtx.drawImage(imgs[0], 000,0, 100, 100);
    bgCtx.drawImage(imgs[1], 100,0, 100, 100);
    bgCtx.drawImage(imgs[2], 200,0, 100, 100);

}

---

您可以在zoom上加载图像之前实施延迟，这样就不会在每次启动zoom命令时下载图像。我不熟悉GoogleMapsAPI，因此请更改事件处理程序代码以匹配API。比如说：

var interval = 500;
var timeOut;
map.zoom(function(){
    clearTimeout(timeOut);
    timeOut = setTimeout(loadAllImages(callback), interval);
}

---

尝试一下时间间隔，看看什么样的延迟最适合你。它越低，被解雇的频率就越高，因为有人在这个时间范围内就越可能没有放大多次。它最终可能是一个非常小的数字，可能是一位数，这取决于它们的缩放速度以及浏览器注册缩放事件的速度

坏主意，此处停止仅用于非常快速的缩放，但如果我一次缩放并等待，浏览器开始下载图像，如果我再次进行第二次缩放，我们将得到队列。如果他们在一秒钟内缩放多次，则可以将间隔增加到1秒。它只下载一次图像。或者，如果你觉得你的用户会这么做，那就让它持续两秒钟。除了在事件回调上实现某种延迟之外，我真的看不到任何其他方法。