Taste Nav-Tab mit Twitter Bootstrap

Question

Diese Taste löst den nächsten Reiter Trigger Inhalte zu laden, aber die Reiter selbst schaltet nicht, bleibt es auf der ersten Registerkarte ..

<br><a class="btn btn-primary" href="#tab2" data-toggle="tab">Review</a><br> 

Hier ist der Code für nav nav-Register:

<ul class="nav nav-tabs"> 
    <li class="active"><a href="#tab1" data-toggle="tab">Shipping</a></li> 
    <li><a href="#tab2" data-toggle="tab">Quantities</a></li> 
    <li><a href="#tab3" data-toggle="tab">Summary</a></li> 
    </ul> 

Jede Lösung zum Umschalten sowohl der Registerkarte & Inhalt sehr geschätzt wird

..per haps eine Möglichkeit, die Taste zu ändern, um die next() Funktion in * Bootstrap-tab.js v2.3.1 auslösen:

, activate: function (element, container, callback) { 
     var $active = container.find('> .active') 
     , transition = callback 
      && $.support.transition 
      && $active.hasClass('fade') 

     function next() { 
     $active 
      .removeClass('active') 
      .find('> .dropdown-menu > .active') 
      .removeClass('active') 

     element.addClass('active') 

     if (transition) { 
      element[0].offsetWidth // reflow for transition 
      element.addClass('in') 
     } else { 
      element.removeClass('fade') 
     } 

     if (element.parent('.dropdown-menu')) { 
      element.closest('li.dropdown').addClass('active') 
     } 

     callback && callback() 
     } 

     transition ? 
     $active.one($.support.transition.end, next) : 
     next() 

     $active.removeClass('in') 
    } 
    } 

Answer 1

Sie könnten zuweisen Ihre Review-Taste ein Klick-Handler mit jQuery ...

JS:

$('#btnReview').click(function(){ 
    $('.nav-tabs > .active').next('li').find('a').trigger('click'); 
}); 

HTML:

<a class="btn btn-primary" href="#" id="btnReview">Review</a> 

Working Demo

Answer 2

Durch Ändern von "Datenumschalten" in "Datenauslöser" für den auslösenden Link kann der folgende Code für alle Trigger mit ähnlichem Markup eine beliebige Registerkarte mit demselben HREF-Attribut auslösen.

(N. B. Selektoren sind nicht optimiert, es ist nur ein Leitfaden für eine flexiblere Lösung)

JS:

$('[data-trigger="tab"]').click(function(e) { 
    var href = $(this).attr('href'); 
    e.preventDefault(); 
    $('[data-toggle="tab"][href="' + href + '"]').trigger('click'); 
}); 

HTML:

<a class="btn btn-primary" href="#tab2" data-trigger="tab">Review</a>