Bootstrap Registerkarte Callback-Ereignis

Question

Bootstrap Registerkarte nav-Tabs Rückruf Klick-Funktion,

<ul class="nav nav-tabs"> 
    <li class> 
     <div> 
      <a href="#logo"></a> 
     </div> 
    </li> 
    <li class = "active"></li> 
    <li class></li> 
</ul> 
<div id="logo"> 
</div> 

Hier möchte ich meine eigene Funktion jedes Mal nach der Änderung Registerkarte hinzufügen,

Answer 1

Try Code unten, von reference

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#myTab a").click(function(e){ 
     e.preventDefault(); 
     $(this).tab('show'); 
    }); 
}); 
</script> 

Answer 2

Suchen Sie so etwas?

$(document).ready(function(){ 
 
    // Listen with the jQuery to the tabs click: 
 
    $('#myTabs a').click(function (link) { 
 
    console.log(link.currentTarget.innerText); 
 
    }) 
 
})

<!-- Latest compiled and minified CSS for Bootstrap --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<!-- Latest compiled and minified JS for JQuery --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!-- Latest compiled and minified JS for Bootstrap --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 
    
 

 
<ul class="nav nav-tabs" id="myTabs"> 
 
    <li class="active"><a data-target="#home" data-toggle="tab">Home</a></li> 
 
    <li><a data-target="#profile" data-toggle="tab">Profile</a></li> 
 
    <li><a data-target="#messages" data-toggle="tab">Messages</a></li> 
 
    <li><a data-target="#settings" data-toggle="tab">Settings</a></li> 
 
</ul> 
 

 
<div class="tab-content"> 
 
    <div class="tab-pane active" id="home">Home content</div> 
 
    <div class="tab-pane" id="profile">Profile content</div> 
 
    <div class="tab-pane" id="messages">Message content</div> 
 
    <div class="tab-pane" id="settings">Settings content</div> 
 
</div>

Bitte lesen Sie official bootstrap Dokumentation, bevor Frage wie die Entsendung.

Answer 3

Und doch niemand sprach über die show.bs.tab und shown.bs.tab Zuhörer, lol

$('.nav-tabs').find('a').on('show.bs.tab', function() { 
    // Some code you want to run before the tab is shown 
}); 

$('.nav-tabs').find('a').on('shown.bs.tab', function() { 
    // Some code you want to run after the tab is shown already (callback) 
}); 

Andere Optionen und Hörer verfügbar hier: W3Schools bootsrap tabs