使用jQueryUI选项卡为AJAX内容预加载图像

使用jQueryUI选项卡为AJAX内容预加载图像,jquery,ajax,jquery-ui,tabs,preloader,Jquery,Ajax,Jquery Ui,Tabs,Preloader,因此,我有一个非常好的应用程序正在使用ui选项卡。。问题是,在显示选项卡面板之前,我一辈子都想不出在ajax内容中预加载图像的方法。我能想到的唯一方法是创建自己的ajax功能来加载选项卡面板内容,并在ajax调用中添加如下内容: success: function(response){ $(response).find('img').preload({ onFinish: function(){ currentTabPane

因此,我有一个非常好的应用程序正在使用ui选项卡。。问题是,在显示选项卡面板之前,我一辈子都想不出在ajax内容中预加载图像的方法。我能想到的唯一方法是创建自己的ajax功能来加载选项卡面板内容,并在ajax调用中添加如下内容:

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


但是我认为应该有更好的方法来实现这一点,使用jQueryUi.tabs()对象中内置的AJAX方法和事件。。我只是觉得我没看到。。。arg。。有什么想法吗???

什么是回应?它代表什么

假设您有一个表示图像的对象列表,称为imgList:

var imagePreloader = new Image();

if(imgList.length != 0)
{
   imagePreloader.load(function() {
      if(imgList.length != 0)
      {
         var img = imglist.pop();
         imagePreloader.src = img.imgSrc;
      }
      else
      {
         currentTabPanel.show();
      }
   });

   imagePreloader.src = imgList.pop().imgSrc;   
}

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

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

我不会对很多大图片这样做,因为在图片完成之前页面不会完成加载,但是如果你必须准备好它们,它会起作用。把它放在你的索引中:)

是的。。唯一的问题是,AJAX内容中的图像是动态的。我不可能知道这些图片的名字。这就是为什么上面有$(response.find('img').preload()代码。。。谢谢,不过…响应只是一些HTML标记,其中可能有也可能没有img标记。那么,您将把这段代码放在哪里,以便在这段代码加载完成之前不会显示选项卡面板的内容呢?