Bootstrap 3 jquery event for active tab change

by 
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
  var target = $(e.target).attr("href") // activated tab
  alert(target);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>

<ul id="myTab" class="nav nav-tabs">
  <li class="active"><a href="#home" data-toggle="tab">Home</a></li>
  <li class=""><a href="#profile" data-toggle="tab">Profile</a></li>
</ul>
<div id="myTabContent" class="tab-content">
  <div class="tab-pane fade active in" id="home">
    home tab!
  </div>
  <div class="tab-pane fade" id="profile">
    profile tab!
  </div>
</div>

More Related Contents:

  1. How make my CSS responsive using Bootstrap 3.1
  2. Bootstrap template plugins are free or not [closed]
  3. Bootstrap carousel multiple frames at once
  4. Bootstrap 3: Keep selected tab on page refresh
  5. Bootstrap 3 Collapse show state with Chevron icon
  6. How can I keep selected Bootstrap tab on page refresh?
  7. Bootstrap throws Uncaught Error: Bootstrap’s JavaScript requires jQuery [closed]
  8. Where is the typeahead JavaScript module in Bootstrap 3 RC 1?
  9. How to make Bootstrap carousel slider use mobile left/right swipe
  10. Use Bootstrap 3 dropdown menu as context menu
  11. Add line break to tooltip in Bootstrap 3
  12. CSS issue on Twitter Typeahead with Bootstrap 3
  13. twitter bootstrap 3 jquery minimum version
  14. Implementing jQuery DatePicker in Bootstrap modal
  15. Add slides to Bootstrap 3 carousel dynamically using jQuery
  16. Bootstrap Carousel showing next and previous image
  17. Typeahead problems with Bootstrap 3.0 RC1
  18. Jquery to open Bootstrap v3 modal of remote url
  19. How to change the element of another div by clicking and hovering on an element of a different div
  20. use jQuery’s find() on JSON object
  21. Custom events in jQuery?
  22. jQuery.animate() with css class only, without explicit styles
  23. jqGrid data stored in browser cache?
  24. $ versus jQuery
  25. How to disable mouse scroll wheel scaling with Google Maps API
  26. jQuery dollar sign ($) as function argument?
  27. Set Headers with jQuery.ajax and JSONP?
  28. jQuery stopPropagation bubble down
  29. jquery array group by
  30. How to cancel navigation when user clicks a link ( element)?

Leave a Comment