Question

所以我有一个非常好的应用程序使用ui-tabs ..问题是，我不能为我的生活想出一种方法在显示选项卡面板之前预先加载我的ajax内容中的图像。我能想到的唯一方法是创建自己的ajax功能来加载选项卡面板内容，并将这样的内容添加到ajax调用中：

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

}

但我认为使用jQueryUi.tabs（）对象中内置的AJAX方法和事件可以更好地解决这个问题。我只是觉得我没看到它...... arg ..任何想法??

Answer 1

什么是回复？它代表什么？

假设您有一个表示图像的对象列表，名为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;   
}

Answer 2

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

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

我不会为大量的大图片做这件事，因为在图像完成之前页面不会完成加载，但是如果你必须准备它们，它就可以了。把它放在你的索引中：）

使用jQueryUI-tabs为AJAX内容预加载图像

2 个答案: