使用jQueryUI选项卡预加载AJAX内容的图像 [英] Preload images for AJAX content using jQueryUI-tabs

问题描述

因此，我有一个使用ui-tabs的非常不错的应用程序.问题是，我一生都无法找到在显示选项卡面板之前在ajax内容中预加载图像的方法.我能想到的唯一方法是为加载选项卡面板内容创建自己的ajax功能，并在ajax调用中添加以下内容:

So I've got a pretty nice application going using ui-tabs.. problem is, I cannot for the life of me figure out a way to pre-load images in my ajax content before the tab panel is shown. The only way I can think of is to create my own ajax functionality for the loading of tab-panel content, and adding something like this to the ajax call:

success: function(response){
    $(response).find('img').preload({
            onFinish: function(){
                    currentTabPanel.show();
            }
    });

}

但是我认为GOT是使用jQueryUi.tabs()对象中内置的AJAX方法和事件来解决此问题的更好方法.我只是不认为自己明白了. .arg ..有什么想法吗?

But I'm thinking there's GOT to be a better way of going about this using the built in AJAX methods and events in the jQueryUi.tabs() object.. I just don't think I'm seeing it... arg.. any ideas??

推荐答案

这是我有时使用的肮脏的小脚本，但效果很好:

This is a dirty little script I use sometimes but it works great:

var imgstopreload = new Array('file1.jpg', 'file2.jpg', 'etc.jpg');
for (x in imgstopreload){
    (new Image).src = imgstopreload[x];
}

我不会对很多大图像执行此操作，因为在完成图像处理之前页面不会完成加载，但是如果必须准备好图像，它将可以正常工作.只需将其放入您的索引中即可:)

I wouldn't do this for lots of big images because the page won't finish loading until the images are done, but if you have to have them ready, it works. Just put it in your index :)

这篇关于使用jQueryUI选项卡预加载AJAX内容的图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！