Question

我的页面上有两次基本的轮播，使用下面的代码

$('.next').bind('click', function() {
    $('.current').removeClass('current').hide().next().show().addClass('current');
    if ($('.current').hasClass('last')) {
         $('.next').attr('disabled', true);
    }
    $('.prev').attr('disabled', null);
});

$('.prev').bind('click', function() {
    $('.current').removeClass('current').hide().prev().show().addClass('current');
    if ($('.current').hasClass('first')) {
        $('.prev').attr('disabled', true);
    }
    $('.next').attr('disabled', null);
});

这是html

<div class="shareBox">
<p class="highlight">
    <button class="prev linkBtn" disabled="disabled">Prev</button>
    <button class="next linkBtn">Next</button>
</p>
<div class="mask">
    <ul class="shareBoxList slides">

        <li class="item">

        </li>


        <li class="item">

        </li>

        </ul>
</div>

我想只定位我点击的那个，但我不确定在函数中添加jquery的位置。

谢谢，

周六

Answer 1

没有HTML很难，但这是逻辑：

$('.next').bind('click', function() {
    var curCarouselNode = $(this).closest('.shareBox');
    curCarouselNode.find('.current').removeClass('current').hide().next().show().addClass('current');
    if (curCarouselNode.find('.current').hasClass('last')) {
         curCarouselNode.find('.next').attr('disabled', true);
    }
    curCarouselNode.find('.prev').attr('disabled', null);
});

所以我们所做的就是获得所点击项目的最高轮播元素。然后使用它来查找您想要与之交互的元素。

仅针对此轮播，同一页面上有多个轮播

1 个答案: