javascript - 每次调用时迭代 for 循环指定的迭代次数，直到数组末尾

Question

我有一个预加载图像函数，我想用它在每次调用时预加载 2 个图像，直到预加载所有图像。这是我的功能:

function preload() {
  for (i; i < images.length; i++) {
    images[i] = new Image()
    images[i].src = '/imagecache/cover/' + images[i]
  }
}

我不知道如何实现这一点，以便能够在每次调用时更改开始和迭代次数 (2)，直到预加载整个图像数组？

已更新

这是我的完整脚本:

 $(document).ready(function () {
    var imagesIndex = 0;
    var loadedImages = new Array();
    var nextImage = 0;
    preload();

    function preload() {
        for (i = 0; i < 2; i++) {
            if (nextImage < images.length) {
                var img = new Image();
                img.src = '/imagecache/cover/' + images[nextImage];
                loadedImages[nextImage] = img;
                ++nextImage;
            }
        }
    }

    $('#forward').click(function() {
      imagesIndex++;
      preload();

      if (imagesIndex > (loadedImages.length - 1)) {
          imagesIndex = 0;
      }

      $('#image').attr({"src" : '/imagecache/cover/' + loadedImages[imagesIndex], "alt" : name});
    });

    $('#back').click(function() {
        imagesIndex--;

        if (imagesIndex < 0) {
            imagesIndex = (loadedImages.length - 1);
        }

        $('#image').attr({"src" : '/imagecache/cover/' + loadedImages[imagesIndex], "alt" : name});
    });
});

这里我有前向和后向函数，我想在它们上调用预加载函数来迭代两次。

Answer 1

跟踪您在函数外的数组中的位置。但首先，您必须解决以下问题:在获取 URL 之前，您使用 Image 对象覆盖了我认为是图像的 URL。

例如:

var nextImage = 0;
function preload() {
    preload1();
    preload1();
}
function preload1() {
    if (nextImage < images.length) {
        var img = new Image();
        img.src = '/imagecache/cover/' + images[nextImage];
        images[nextImage] = img;
        ++nextImage;
    }
}

当然，您可以使用循环代替 preload1。