0

我有一个包含图像的文件夹，我正在使用 jQuery 加载这些图像。这段代码：

$(function () {
    var i=1;
    for (i=1;i<=50;i++){
        var curImg = "blog/wp-content/uploads/" + i + ".jpg";
        var img = new Image();         
        $(img).load(function () {                                 
             $(this).hide();
             $('#loader').removeClass('loading')
                         .append(this);
             $(this).fadeIn();
         }).error(function () {})                            
         .attr('src', ''+curImg+'');                    
    }
});

可以很好地从此文件夹中顺利加载 50 张图像。我正在尝试做两件事：

  1. 我想添加这样的链接：<a href='blog/wp-content/uploads/" + i + ".jpg' class='picLink'>到每个单独的图像。我曾尝试.wrap在我的.load函数中使用，但这对我不起作用。这只是创建了一个链接嵌套（例如<a><a></a></a>）。
  2. 目前这会找到前 50 张照片，从 1 号开始，然后加载它们。但是，如果添加更多照片，它们将不会被找到，并且最旧的将永远是第一个。我希望它找到文件夹中的所有照片并首先打印最新的（最高数字）。可以假设不会超过 4000 张照片。那么是否可以反向执行此循环，从 4000 开始，检查该照片是否存在并继续工作并加载文件夹中存在的照片？

在此先感谢您的帮助，我希望问题足够清楚！

4

1 回答 1

0

对于 1. 你可以做这样的事情

$(function () {
    var i=1;
    for (i=1;i<=50;i++){
        var curImg = "blog/wp-content/uploads/" + i + ".jpg";
        var img = new Image();         
        $(img).load(function () {                                 
             $(this).hide();
             $('#loader').removeClass('loading')
                         .append($('<a href="'+this.src+'"></a>').append(this));
             $(this).fadeIn();
         }).error(function () {})                            
         .attr('src', ''+curImg+'');                    
    }
});

此外，它们可能不按顺序加载，因为某些图像的加载时间可能比其他图像长。

对于 2. 我认为您应该在服务器端获取图像计数并将其注入到 for 循环中，例如，

for (i=<?php echo $count; ?>; i > <?php echo ($count>50?$count-50:0); ?>; i--){

假设您使用的是 php，其中$count表示文件夹中的图像数量。

于 2012-05-08T22:47:45.900 回答