javascript - 仅定位此轮播，同一页面上的多个轮播

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);
});

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