Как найти выбранную вкладку с помощью jquery?

Question

Я использую вкладки с помощью jquery и не хочу использовать jQuery UI. Как найти, какую вкладку я нажал?

Вот моя структура

<div class="tabs"> 
    <!-- Tabs starts --> 
    <div class="tabview-content"> 
     <div class="card-panel-selector"> 
      <div class="-card-panel-selector-content"> 
       <div class="card-panel-selection card-panel-current"> 
        <div class="panel- label"><span>XYZ</span> 
        </div> 
       </div> 
       <div class="card-panel-selection"> 
        <div class="panel-label"><span>ABCD</span> 
        </div> 
       </div> 
       <div class="card-panel-selection card-panel-selection-account"> 
        <div class="panel-label"><span>PQRS</span> 
        </div> 
       </div> 
       <div class="card-panel-selection"> 
        <div class="panel-label"><span>ASDF</span> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>` 

Answer 1

Вкладки Вы, вероятно, хотите добавить какой-то класс, когда одна из вкладок была нажата и добавить selected класс к этой конкретной вкладке, как показано ниже:

//When a tab is clicked' 
$('.tab').click(function(){ 
    //Remove all existing selections 
    $('.tab').removeClass('selected'); 
    //Select the current tab 
    $(this).addClass('selected'); 

    //Logic to show/hide all the tabs except for the selected ones 
}); 

Если вы приняли подход, аналогичный приведенному выше, вы всегда можете получить доступ к вкладке, которая выбирается через следующий селектор:

//Grabs the currently selected tab 
$('.tab.selected') 

Edit: Обновление для более конкретного ответа на ситуацию ФП в

Похоже, что вы используете класс card-panel-current, чтобы указать на вкладку, которая выбрана, так что вы можете изменить в приведенном выше примере, соответственно:

//Your panel was selected 
$('.card-panel-selection').click(function(){ 
    //Unselect all previous panels 
    $('.card-panel-selection').removeClass('card-panel-current'); 
    //Select the current one 
    $(this).addClass('card-panel-current'); 

    //Logic to show/hide contents here 
}); 

Схватив текущую вкладку можно сделать аналогично выше, а также:

$('.card-panel-selection.card-panel-current') 

или

$('.card-panel-current')