Question

我试图找到一种方法来计算特定文件夹中的图像数量。我有几个画廊按钮，都有一个唯一的ID。我需要使用该ID来查找与该ID相关的文件夹中有多少图像。以下是我使用的代码：

HTML：

<div class="popup resizeHeight"><a href="#" style="color:#FFFFFF;" class="closeMiniGallery"><img src="close.jpg" /></a><img src="" /></div>
<div class="overlay"></div>

<a href="#" class="menuGallery"><span class="locId">T1</span>GALLERY</a><br />
<a href="#" class="menuGallery"><span class="locId">T2</span>GALLERY</a>

CSS：

.popup{
    position:fixed;
    top: 35px;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    width:95%;
    max-width:600px;
    height:300px;
    background:#ffffff;
    border:1px solid #cccccc;
    z-index:1000;
    display:none;
    max-height:400px;
}
.overlay{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:#3e86b5;
    display:none;
    z-index:999;
    opacity:0.9;
    filter:alpha(opacity=90);
}
.closeMiniGallery{
    position:absolute;
    top: -26px;
    right:-1px;
    text-align:center;
    background:#000000;
}
.resizeHeight{
    bottom:5%;
    height:auto !important;
}
.locId{
    display:none;
}

jQuery的：

$(document).ready(function(){
    $('.menuGallery').each(function(){
        var locationId = $(this).children('span').text();
        $(this).attr('id','gallery'+locationId);
    });
    $('.menuGallery').click(function(){    
        var miniGallery = $(this).attr('id');
        miniGallery = miniGallery.replace("gallery", "");
        console.log(miniGallery);

        $('.popup').fadeIn('fast');
        $('.popup > img').attr('src', '/images/properties/'+miniGallery+'/large/1.jpg');
        $('.overlay').fadeIn();
        return false;
    });

    $('.closeMiniGallery').click(function(){
        $('.popup').fadeOut('fast');
        $('.overlay').fadeOut();
        return false;
    });

    $('.overlay').click(function(){
        $('.popup').fadeOut('fast');
        $('.overlay').fadeOut();
        return false;
    });
});

任何有关这方面的帮助都会很棒，我试图让它尽可能自我维护。我的下一个阶段将是：

jQuery的：

$（＆＃39; .menuGallery＆＃39）。单击（函数（）{ var imageCount = // / images /＆＃39; + $（this）.children（＆＃39; span＆＃39;）中的文件数.text（）+＆＃39; / thumbs /

//然后渲染图像

..... }）;

我正在寻找一种计算文件的方法，例如上面的伪示例。

Answer 1

您可以编写一个简单的PHP脚本来计算图像

echo iterator_count(new DirectoryIterator('/path/to/images'));

从你的jquery脚本中调用它

$.get('count_images.php', function(data) {
  alert(data);
});

Answer 2

我设法使用一些jQuery和PHP来实现这一点。

PHP：

$imageGallery = $_GET['LocId'];

$directory = 'images/'.$imageGallery.'/thumb/';
$files = glob($directory . '*.jpg');

if ( $files !== false ){
    $filecount = count( $files );
    echo $filecount;
}else{
    echo 0;
}

jQuery的：

$（＆＃39; .menuGallery＆＃39）。每一（功能（）{         var locationId = $（this）.children（＆＃39; span＆＃39;）。text（）;         $（本）.attr（＆＃39;编号＆＃39;＆＃39;画廊＆＃39; + locationId）;     }）;     $（＆＃39; .menuGallery＆＃39;）上（＆＃39;单击＆＃39;，函数（）{
        var miniGallery = $（this）.attr（＆＃39; id＆＃39;）;         执行console.log（miniGallery）         miniGallery = miniGallery.replace（＆＃34; gallery＆＃34;，＆＃34;＆＃34;）;
        的console.log（miniGallery）

    $('.imageCount').load("mini-gallery.php?LocId="+miniGallery);

    var counter = 0;
    setInterval(function(){


        if(counter < 1){
            var imageCount = parseInt($('.imageCount').text());     
            console.log(imageCount);

            for ( var i = 1; i < (imageCount+1); i++ ) {
                $('.galleryImages').append('<img src="images/'+miniGallery+'/thumb/'+i+'.jpg" />');
            }
            counter = 1;
        }else{

        }           
    },500);

    $('.popup').fadeIn('fast');
        $('.overlay').fadeIn();

    return false;
});


$('.closeMiniGallery').click(function(){
    $('.popup').fadeOut('fast');
    $('.overlay').fadeOut();
    $('.galleryImages').empty();
    return false;
});

$('.overlay').click(function(){
    $('.popup').fadeOut('fast');
    $('.overlay').fadeOut();
    $('.galleryImages').empty();
    return false;
});

关于文件夹中点击计数文件的jQuery

2 个答案: