Question

这是烘烤我的面条，任何专业的想法/建议都非常感谢。

我的标记如下......

<a href="#" class="launch-fancybox">Preview Image Gallery</a>


<!-- lots of mark up in between -->


<a href="enlarge-1.jpg" class="fancybox"><img src="thumb-1.jpg" alt=""/></a>

<a href="enlarge-2.jpg" class="fancybox"><img src="thumb-2.jpg" alt=""/></a>

<a href="enlarge-3.jpg" class="fancybox"><img src="thumb-3.jpg" alt=""/></a>

<a href="enlarge-4.jpg" class="fancybox"><img src="thumb-4.jpg" alt=""/></a>

然后我的fancybox jquery ......

$('.fancybox').on('click', function () {

    var data = $(this).attr('data-rel');

    $('.fancybox[data-rel="' + data + '"]').attr('rel','fancybox-thumb').fancybox({

        prevEffect  : 'none',
        nextEffect  : 'none',
        helpers : {
            title   :  null,
            overlay : {
                opacity : 0.8,
                css : {
                    'background-color' : '#000'
                }
            },
            thumbs  : {
                width   : 50,
                height  : 50
            }
        },
        closeClick: true

    });

});

现在我的问题是，如何通过类'launch-fancybox'获取我的链接，找到与'fancybox'类相关的第一个/最近的链接并运行上面的脚本。

基本上我想模拟点击第一个缩略图。而是点击“launch-fancybox”链接。

我如何做到这一点的任何想法或指示都会很棒。

由于

=============================================== =======

我甚至尝试将我的jquery放入函数中......

fancybox = function () {

    var data = $(this).attr('data-rel');

    $('.fancybox[data-rel="' + data + '"]').attr('rel','fancybox-thumb').fancybox({

        prevEffect  : 'none',
        nextEffect  : 'none',
        helpers : {
            title   :  null,
            overlay : {
                opacity : 0.8,
                css : {
                    'background-color' : '#000'
                }
            },
            thumbs  : {
                width   : 50,
                height  : 50
            }
        },
        closeClick: true

    });

};

$('.fancybox').on('click', fancybox);


$('.launch-fancybox').on('click', function (e){

    e.preventDefault();

    $(this).closest('.fancybox').click();

});

Answer 1

jQuery的closest方法应该做你想做的事。

Answer 2

$('.launch-fancybox').click(function(e){
    e.preventDefault();
    $(this).next('.fancybox').click();
});

单击时点击jquery会激活另一个，但标记中最近的一个

2 个答案: