Question

我已经将循环插件设置为在一个页面上多次工作，这一切都正常。我试图添加一个滑动事件，使用touchwipe插件，它可以在单循环旋转木马上正常工作，但我不能让它在倍数上工作。

这是我的Javsacript，显示循环代码，以及底部的Touchwipe添加：

function galleries () {     

    var counter = 1

    $('.gallery .pics').each(function() {
        $(this).parent().attr('id','slideshow_'+counter);
        $(this).before('<ul class="next-prev-nav"><li><a href="#" class="prev-'+counter+'">Previous</a></li><li><a href="#" class="next-'+counter+'">Next</a></li></ul><div style="clear:both;"></a>');
        $(this).after('<ul class="gallery-nav-'+counter+'">');
        $(this).cycle({
            fx: 'scrollHorz',
            speed:  '400', 
            timeout: '4000', 
            pager:  '.gallery-nav-'+counter,
            next: '.next-'+counter,
            prev: '.prev-'+counter,
            pause:   1,
            pauseOnPagerHover: true, 
            startingSlide: 0, // zero-based 

            pagerAnchorBuilder: function(id, slide) { 
                var s = $(slide);
                var imgsource = s.find('img.CycIMG').attr('src');

                // Set this as the source for our image
                return '<li><a href="#"><img src="' + imgsource + '" width="62" alt=""></a></li>';  
            }
        }).cycle('pause');
        $(this).touchwipe({
            wipeLeft: function() {
                $('.pics').cycle('next');       
            },
            wipeRight: function() {
                $(this).cycle('prev');
            }
        });
        counter++;
    });
}

从$（this）.touchwipe开始的代码行是我无法工作的。我在这里展示了两个不同的例子。 “wipeLeft”功能有效，但由于它是针对通用类（“pics”），它会立即滑动所有轮播。 “wipeRight”功能就是我喜欢它的工作原理，使用“this”来定位循环中的当前循环轮播。我已经尝试为我在开始时创建的每个轮播定位个人ID，但这似乎不起作用。

非常感谢任何帮助！

Answer 1

尝试在代码中添加上下文选择器：

$('.gallery .pics').each(function() {
    var parent = this.parentNode;

    /*...*/

    $(this).touchWipe({
        wipeLeft: function(){
            $('.pics', parent).cycle('next');
        }
    });
});

这样做是为了添加＆＃34; context＆＃34;到您的选择器。它与此类似：$(parent).find('.pics')

我实际上处理与你完全相同的情况，并且我已经对它进行了测试：）

为ipad使用带有touchwipe（滑动）事件的多个jquery循环

1 个答案: