更改图像的src属性是否会阻止图像下载？

Question

假设我有两个手风琴标签。第一个加载数百个图像，并在页面加载时打开。

如果用户点击第二个手风琴选项卡，我希望能够停止下载图像。是否通过js更改图像的src属性会阻止图像下载？或者请求是否一直持续到完成并且不显示在页面上？

Answer 1

我有一个脚本可以在3秒钟内加载SO徽标，这是我为另一个问题所做的。

http://alexturpin.net/slowimage/slowimage.php

使用它，我试图重现这个问题：

var img = new Image();
img.onload = function() {
    alert("loaded");
};
img.src ="http://alexturpin.net/slowimage/slowimage.php";

setTimeout(function() {
    img.src = "";
}, 1000);

http://jsfiddle.net/Xeon06/RrUvd/1/

根据我收集的信息，在Chrome中，onload不会被解雇，但浏览器会继续显示微调器，如果我进入网络选项卡并找到我的图像并查看其内容，那么它就在那里。所以我的回答是没有，图片仍会加载，至少在Chrome中。

这是一个有趣的问题，我建议您尝试在尽可能多的浏览器中测试它并在其上写一些博客文章。

Answer 2

  

您的浏览器会询问具有特定HTTP GET请求的图像，如   在HTTP协议中指定。一旦它要求它，http服务器   开始转移。

     

因此，它位于浏览器（作为http客户端）和http服务器之间。

     

由于http协议没有考虑中止的选项   转移时，浏览器应该实现一种不合标准的机制   以编程方式中止连接。但由于没有具体说明   在任何标准中，我认为你找不到任何方法来做到这一点   javascript或任何客户端代码。

---

  

您可以尝试使用window.stop（）来停止所有请求，但不能单独停止   的。

---

  

如果你想停止对大图片的单一请求，那你就是什么   可以做的是将图像加载到隐藏的IFRAME中的文档中。该   IFRAME的onload事件可用于将图像加载到main中   文档，到那时它应该被缓存（假设你有   配置为执行此操作的缓存指令。）

     

如果图像花费的时间太长，则可以访问IFRAME   contentWindow并发出一个停止命令。

     

您需要拥有尽可能多的IFRAME元素   同时请求。

直接来自here＆amp; here

Answer 3

不确定是否会，就像其他评论一样。但我可以建议一种方法可行。假设并非所有图像都可见，只需在可见时设置正确的src属性即可。

因此，当myGray.gif不可见时，将其默认为myGray.gif，并在它进入视图时将其设置为myImage.jpg。

当你关闭当前的手风琴时，你可以再次将图像源设置回你的轻量级gif。 （这可以防止某些版本的ipad上与gc相关的错误）。