javascript - 如何在此代码中的选项卡内制作选项卡？

Question

请告诉我如何在这段代码中制作标签内标签？

$('.tabs-box').each(function(){
    $(this).find('.tabs-sel span:first').addClass('current');
    $(this).find('.tabs-b:first').addClass('visible');
});
$('.tabs-sel').delegate('span:not(.current)', 'click', function() {
    $(this).addClass('current').siblings().removeClass('current')
    .parents('.tabs-box').find('.tabs-b').hide().eq($(this).index()).fadeIn(400);
});

.tabs-b {display:none;}
.tabs-b.visible {display:block;}
.tabs-sel {padding:20px 0 0 20px;}
.tabs-sel span {display:inline-block; padding:10px 20px; vertical-align:top; cursor:pointer;}
.tabs-sel span.current {background-color:#4e647a;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="tabs-box">
    <div class="tabs-sel"><span class="current">1</span><span>2</span><span>3</span></div>
    <div class="tabs-b visible">12</div>
    <div class="tabs-b">13</div>
    <div class="tabs-b">14</div>
</div>

https://codepen.io/senopsisder/pen/zaEpBV

Answer 1

Try something like this in one of the sub tabs:

  <div class="tabs-b visible">
    <div class="tabs-sel">
    <span class="current">12</span>
    </div>
   </div>