Javascript：取消/停止图像请求

Question

我有一个大量使用Ajax的网站。有时我需要在页面上为用户加载大图像文件。我的问题是，当下载这些大图像文件时，如果用户离开显示图像的页面，有没有办法阻止它们？谢谢。

Answer 1

假设您正在使用ajax加载图像，则可以简单地在window.onunload事件中中止请求。为您使用的XMLHttpRequest对象声明一个全局变量。

var xhr;

//if using the XMLHttpRequest object directly

//you may already be doing something like this

function getImage(...){

  xhr = new XMLHttpRequest();

  xhr.open(....);

}

如果使用jQuery，则可以将$ .ajax（）或$ .get调用的返回值分配给xhr变量。

xhr = $.ajax(.....);

处理window.onunload并中止请求。

window.onunload = function(){

  xhr.abort();

}

Answer 2

在IE7中无法将SRC标签重新分配给其他图像，它继续尝试下载第一个图像。

这是设置：

我创建了一个JPEG类型的HTTP处理程序。它包含永远无法完成执行的代码。因此someImage.src = myhandler.ashx将永久坐在那里加载直到超时。

在此过程中，按另一个按钮将图像重新分配到一个小的图像文件：someImage.src = small.jpg

即使重新分配了src，对myhandler.ashx的请求也不会结束。

此外，如果您实际上删除了节点，则someImage.parentNode.removeChild（someImage）仍会继续尝试下载myhandler.ashx

经过IE7测试，并受HTTP Watch Pro监控。