通过 AJAX 加载内容和预加载图像?
假设我喜欢:
$(function() {
$('a').click(function(e) {
e.preventDefault();
var h = $(this).attr('href');
$('#content').load(h);
});
});
实际上并没有加载图像,它只是加载内容,那么您如何加载实际图像呢?
有些人似乎不明白:我的意思是它确实加载图像但不“预加载”,因此意味着您会看到图像单独加载。
编辑:假设 href 等于 somepage.html 并且该页面上有图像和内容,是的,它会加载图像和内容,但实际上根本不会预加载图像,您仍然看到图像单独加载。如何在请求本身中预加载图像?
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?
试试这个:
#content
div,然后调用load
。这将以不可见的方式加载内容,以便您的用户看不到图像加载后load
事件处理程序,当它们全部触发时,重新显示#content div
请参阅此答案以供参考:了解 AJAX 响应中图像何时完成加载< /a>.它将准确地告诉您该做什么。
Try this:
#content
div, and callload
on it. This will load the content invisibly so your users don't see the images load afterwardsload
event handlers on each image, and when they have all fired, re-show the#content
divSee this answer for reference: Know when images are done loading in AJAX response. It will show you exactly what to do.