通过AJAX加载内容和预加载图像？

Say I have like:

说我喜欢：

$(function() {
    $('a').click(function(e) {
        e.preventDefault();
        var h = $(this).attr('href');
        $('#content').load(h);
    });
});

That actually doesn't load the images as well it just loads the content, how do you go about loading the actual images too?

这实际上并没有加载图像，只是加载内容，你如何加载实际的图像呢？

Some people didn't seem to understand: what I mean is it does load the images but doesn't 'preload' thus meaning you witness the images load individually.

有些人似乎并不理解：我的意思是它确实加载了图像但没有“预加载”，因此意味着您可以看到图像单独加载。

Edit: Say the href was equal to somepage.html and that page had images on it as well as content, yes it would load the images and the content but it doesn't actually preload the images at all, you're still witnessing the images load individually. How would one go about preloading the images in the request itself?

编辑：假设href等于somepage.html，该页面上有图像和内容，是的，它会加载图像和内容，但它实际上并没有预先加载图像，你仍然在见证图像单独加载。如何在请求本身中预加载图像？

2 个解决方案

#1

Try this:

尝试这个：

Hide the #content div, and call load on it. This will load the content invisibly so your users don't see the images load afterwards
隐藏#content div，并在其上调用load。这将无形地加载内容，因此您的用户之后不会看到图像加载
Bind load event handlers on each image, and when they have all fired, re-show the #content div
在每个图像上绑定加载事件处理程序，当它们全部触发时，重新显示#content div

See this answer for reference: Know when images are done loading in AJAX response. It will show you exactly what to do.

请参阅此答案以供参考：了解何时在AJAX响应中加载图像。它会告诉你到底该做什么。

#2

See the worked example here on how to preload your images;

请参阅此处的工作示例，了解如何预加载图像;

http://engineeredweb.com/blog/09/12/preloading-images-jquery-and-javascript

#1