jQuery根据需要加载图像 [英] jQuery loading images on demand

问题描述

我正在尝试按需加载图像，以防止不需要的图像的下载。我正在使用jQuery。到目前为止，这是我想出的：

I am trying to load images on demand, in order to prevent downloading of unneeded images. I am using jQuery. So far, this is what I have come up with:

$('#region_image').attr({'src':'/images/'+e.key+'.jpg'}).load(function(){
    $(this).fadeIn();
});
// e.key is the name of the image I want to load now.

是否有任何注意事项？

编辑

注意事项1：

在循环中绑定加载事件时，请记住下次运行时将绑定两次。

When binding the load event in a loop, remember it will be bound twice on the next run.

Caveat Nr。 2：

尝试加载的图像必须始终存在，或者应该出现错误处理。

The image attempted to load must, at all times, exist, or error handling should be in place.

推荐答案

有一个很好的图书馆： JAIL

There is a good library: JAIL

如果可视图像和视口（矩形观看区域）可见，则将下载所选图像。触发事件（例如点击，鼠标悬停，滚动）或指定延迟后，可以加载图像。建立DOM后可以调用jail（）（文档就绪）。

Selected images will be downloaded if they are visible and when they are visible inside the viewport (rectangular viewing region). Images can be loaded after an event is triggered (such as click, mouseover, and scroll) or after a specified delay. It's advisable to call jail() after the DOM has been constructed (document ready).

这篇关于jQuery根据需要加载图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！