1

我试图在这里预加载一些图像。但我需要的是在数组中预加载一些图像，并显示进度。

这是有效的，但它给了我控制台中的GET 404（未找到）。但它的工作。我能做些什么来避免这个警告？

谢谢！

function start(id) {
    var images = new Array();
    images[0] = "http://www.travelblog.org/Wallpaper/pix/tb_fiji_sunset_wallpaper.jpg";
    images[1] = "http://www.fantasy-and-art.com/wp-content/gallery/abstract-wallpapers/lion_hd_wallpaper.jpg";
    images[2] = "http://hidefwallpaper.org/wp-content/gallery/1_apple_wallpaper_02/90831582ea8e018759044f2820b518d1.jpg";
    imageObj = new Image();
    imageObj.src = images[id];
    imageObj.onload = function() {
        if (id == images.length) {
            alert('Carregou tudo');
        }
        if (id < images.length) {
            start(id + 1);
            alert(id);
        }
    }
}
start(0);​
4

2 回答 2

2

您对 start 函数的递归调用执行了太多次，这就是为什么您会收到 404 消息的原因，因为没有索引等于数组长度的数组元素。数组是从零开始的。因此，例如，当您if (id < images.length) {在 id 为 2 时调用时，您将 id 增加到 3 并再次调用 start，但是没有图像 [3]。

试试这个：

var images = new Array();
images[0] = "http://www.travelblog.org/Wallpaper/pix/tb_fiji_sunset_wallpaper.jpg";
images[1] = "http://www.fantasy-and-art.com/wp-content/gallery/abstract-wallpapers/lion_hd_wallpaper.jpg";
images[2] = "http://hidefwallpaper.org/wp-content/gallery/1_apple_wallpaper_02/90831582ea8e018759044f2820b518d1.jpg";

function start(id) {
    imageObj = new Image();
    imageObj.src = images[id];
    imageObj.onload = function() {
        if (id == images.length) {
            console.log('Carregou tudo');
        }
        if (id < (images.length-1)) {
            start(id + 1);
        }
    }
}
start(0);​
于 2012-06-08T19:48:51.050 回答
1

首先设置图像数组......然后。

for(var i = 0; i < images.length; i++){
    imgsrc = images[i];
    var obj = new Image();
    obj.src = imgsrc;
    obj.id = i;
    obj.onload = function(){
       if(this.id == images.length-1){
          alert('Carregou tudo');
       }
    }
}
于 2012-06-08T19:41:15.327 回答