jQuery 循環：多張幻燈片，統計單個孩子

Question

我正在使用 jQuery Cycle 在同一頁面上創建多個幻燈片。 一些幻燈片只有一張圖片。 對於這些，我想隱藏下一張/上一張圖片。 不知道為什么這段代碼不起作用，但我懷疑它正在計算所有幻燈片的所有孩子。 如果是這種情況，我需要它來單獨計算每個幻燈片的長度。 JSFiddle 在這里

jQuery

if ( $('.slideshow').children().length < 1 )
    $(this).parent().find('.controls').hide();
else
$('.slideshow').each(function() {
    var cycle = $(this),
    controls = cycle.parent().find('.controls');
    cycle.cycle({
        timeout: 0,
        speed: 'fast',
        fx: 'scrollHorz',
        next: controls.find('.next'),
        prev: controls.find('.prev'),
        before: function(curr,next,opts) {
                    var s = ($(next).index() + 1) + '/' + opts.slideCount;
                    $(opts.caption).html(s)
                },
        caption: cycle.parent().find('p.caption'),
    });
});

HTML

   <div class="container">
    <ul class="slideshow">
        <li><img alt="product" src="http://placehold.it/500x500" /></li>
        <li><img alt="product" src="http://placehold.it/500x500" /></li>
        <li><img alt="product" src="http://placehold.it/500x500" /></li>
    </ul>
    <div class="controls"><a href="#" class="prev">Prev</a> <a href="#" class="next">Next</a></div>
</div>

<div class="container">
    <ul class="slideshow">
        <li><img alt="product" src="http://placehold.it/500x500" /></li>
    </ul>
    <div class="controls"><a href="#" class="prev">Prev</a> <a href="#" class="next">Next</a></div>
</div>

Answer 1

$(document).ready(function() {    
    $('.slideshow').each(function() {        
        if ( $(this).children().length <= 1 )
            $(this).parent().find('.controls').hide();
        else{
            var cycle = $(this);
            controls = cycle.parent().find('.controls');
            cycle.cycle({
                timeout: 0,
                speed: 'fast',
                fx: 'scrollHorz',
                next: controls.find('.next'),
                prev: controls.find('.prev'),
                before: function(curr,next,opts) {
                            var s = ($(next).index() + 1) + '/' + opts.slideCount;
                            $(opts.caption).html(s)
                        },
                caption: cycle.parent().find('p.caption'),
            });
        }
    });    
});