如何在不使用window.stop（）的情况下中止图像加载请求

Question

我有一个很长的页面，可在用户滚动浏览时动态加载图像。

但是，如果用户快速滚动离开页面的某个部分，我不希望图像继续加载到页面的该部分视图之外。

除了图像加载外，页面上还同时发生了许多其他请求，因此在scroll事件上触发钝化window.stop（）是不可接受的。

我尝试删除并清除不再可见的图像的img src属性，但是，由于请求已经启动，因此图像会继续加载。

请记住，当用户短暂滚动经过页面的那部分时，图像src已被填充。但是一旦过去，如果不使用window.stop（），就无法停止加载该图像。清除src无效。（Chrome和FF）

Answer 1

正如nrabinowitz所提到的，您正在尝试做的是错误的方法。您不能只是“取消”图像的加载过程（将src属性设置为空字符串不是一个好主意）。实际上，即使这样做，也只会使情况变得更糟，因为服务器将不断发送会被取消的数据，从而增加了负载率并降低了速度。另外，请考虑以下事项：

1. 如果您的用户在页面上上下滚动，则可能会导致加载延迟。
2. 在开始加载页面的一部分之前具有超时延迟（例如200毫秒）是完全可以接受的，并且在页面上间隔200毫秒后，一次停止并跳转多少次？即使发生，也可以回到第1点
3. 您的图片有多大？即使是速度较慢的服务器，每秒也可以提供大约几十个3Kb的缩略图。如果您的网站具有较大的图像，请考虑将低分辨率和高分辨率图像与lightBox等组件一起使用

通常，计算机问题仅仅是设计问题。

编辑

这是一个主意：

1. 您的页面应显示DIV具有预期图像大小的宽度和高度的容器（使用CSS设置样式）。在每个内部DIV，添加一个链接。例如 ：

   <div class="img-wrapper thumbnail">
   

   href="http://www.domain.com/path/to/image">Loading…