Перейти на последнюю вкладку в Click jQuery

Question

Я использую вкладки jquery для своего сайта. Теперь я хочу перейти на последнюю вкладку на определенных условиях. Для этого я пишу код, но не работал. Мой код табуляции:

<div class="wizard"> 
     <a href="#step1" role="tab" id="tab1" data-toggle="tab" class="current" style="pointer-events: none;"><span class="hidden-xs">Step</span> 1</a> 
     <a href="#step2" role="tab" id="tab2" data-toggle="tab" style="pointer-events: none;"><span class="hidden-xs">Step</span> 2</a> 
     <a href="#step3" role="tab" id="tab3" data-toggle="tab" style="pointer-events: none;"><span class="hidden-xs">Step</span> 3</a> 
     <a href="#step4" role="tab" id="tab4" data-toggle="tab" style="pointer-events: none;"><span class="hidden-xs">Step</span> 4</a> 
     </div> 

Я пытаюсь перейти от step1 к step4 .Я использую этот код, чтобы переместить next.I зову эту функцию как этот change('step1'); .Но когда я стараюсь, как этого change('step4'); его не working.It переходит на второй стадии вместо 4-го.

jQuery('a.btn').each(function() { 
     jQuery('.wizard a[data-toggle="tab"]').removeClass('current'); 
     jQuery('.wizard a[href="#'+hrf+'"]').click(); 

    }); 

Некоторый другой код:

jQuery(document).ready(function(jQuery) { 
    jQuery('.wizard a[data-toggle="tab"]').each(function() { 
    jQuery(this).on('shown.bs.tab', function() { 
     jQuery('.wizard a[data-toggle="tab"]').removeClass('current'); 
     jQuery(this).addClass('current'); 
    }); 
    }); 

Answer 1

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

Вы можете использовать опцию active, чтобы установить конкретную вкладку как активную.

Вы можете легко перейти к последней вкладке, установив активный как -1.

---

$("#tabs").tabs(); 
 

 
$("#tabs").tabs("option", "active", -1);

<link href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
 
<div id="tabs"> 
 
    <ul> 
 
    <li><a href="#tabs-1">Nunc tincidunt</a> 
 
    </li> 
 
    <li><a href="#tabs-2">Proin dolor</a> 
 
    </li> 
 
    <li><a href="#tabs-3">Aenean lacinia</a> 
 
    </li> 
 
    </ul> 
 
    <div id="tabs-1"> 
 
    <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper 
 
     leo. Vivamus sed magna quis ligula eleifend adipiscing.</p> 
 
    </div> 
 
    <div id="tabs-2"> 
 
    <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean 
 
     aliquet fringilla sem.</p> 
 
    </div> 
 
    <div id="tabs-3"> 
 
    <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia 
 
     nostra, per inceptos himenaeos..</p> 
 

 
    </div> 
 
</div>

Answer 2

Вам не нужен каждый цикл в Change функции.

function change(hrf){ 
    jQuery('.wizard a[data-toggle="tab"].current').removeClass('current'); 
    jQuery('.wizard a[href="#'+hrf+'"]').click(); 
} 

Edited

Проверить этот код в bootrap

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { 
    e.target // newly activated tab 
    e.relatedTarget // previous active tab 
}); 

проверка: http://getbootstrap.com/javascript/#tabs