CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrap
Frog82
Frog82

Reputation: 464

Bootstrap Nav Tabs - Fire Javascript

I'm using a basic Bootstrap tab structure, where I wish to fire a Javascript event once the tab is clicked. I can't figure out how to do this. This is the code I have come up with so far:

            <ul class="nav nav-tabs nav-justified">
              <li class="active"><a data-toggle="tab" href="#tab1"> tab(<?php echo $count ?>) </a></li>
              <li><a data-toggle="tab" href="#menu2"> tab(<?php echo $count3 ?>) </a></li>
              <li><a data-toggle="tab" href="#menu1"> tab(<?php echo $count2 ?>) </a></li>                    
            </ul>

and the Javascript:

$("#menu2").click(function() {
        alert('yes, the click actually happened');
    });

Upvotes: 1

Views: 96

Answers (2)

Dannn
Dannn

Reputation: 316

$('.nav-tabs a[href="#menu2"]').click(function() {

Upvotes: 1

user3557705
user3557705

Reputation: 15

You have to do:

 $('[href=#menu2]').on('shown.bs.tab', function (e) {
             alert('Your Code')
 });

This event fires on tab show after a tab has been shown. Use event.target and event.relatedTarget to target the active tab and the previous active tab (if available) respectively.

http://getbootstrap.com/javascript/

Upvotes: 0

Related Questions