如何在包装器中指定div元素

时间:2019-03-03 06:09:34

标签: javascript html

我正在尝试使用以下脚本,但是我已将'tab-prev'和'tab-next'按钮放置在.tab-wrapper内的div中,我不知道如何选择他们在那个div内?

<script>  
var Webflow = Webflow || [];
Webflow.push(function() {

$('.tab-wrapper’).on('click', '.tab-prev, .tab-next', function() {

var direction = $(this).hasClass('tab-prev') ? -1 : 1;

var tablinks = $(this).parent().find('.w-tab-menu');

var index = tablinks.find('.w--current').index() + direction;

index = index >= tablinks.children().length ? 0 : index;

tablinks.find('.w-tab-link').eq(index).trigger('click');

   });
 });
</script>

和html示例

<div class=“wrapper”>
    <div class=“w-tab-menu”>
         <a data-w-tab="Tab 1" class="w-tab-link">
         <a data-w-tab="Tab 2" class="w-tab-link">
    </div>
    <div class=“w-tab-panes”>
         <div data-w-tab="Tab 1" class="w-tab-pane">
         <div data-w-tab="Tab 2" class="w-tab-pane">
    </div>
    <div class=“bottom-buttons”>
         <a href="" class="tab-prev">Prev</a>
         <a href="" class="tab-next">Next</a>
    </div>
 </div>

1 个答案:

答案 0 :(得分:0)

您可以使用此按钮选择上一个和下一个按钮:

var $prev = $('.tab-prev');
var $next = $('.tab-next');