How do I keep the current tab active with twitter bootstrap after a page reload?

You’ll have to use localStorage or cookies to manage that. Here’s a quick and dirty solution that can be vastly improved, but may give you a starting point:

$(function() { 
    // for bootstrap 3 use 'shown.bs.tab', for bootstrap 2 use 'shown' in the next line
    $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
        // save the latest tab; use cookies if you like 'em better:
        localStorage.setItem('lastTab', $(this).attr('href'));
    });

    // go to the latest tab, if it exists:
    var lastTab = localStorage.getItem('lastTab');
    if (lastTab) {
        $('[href=""https://stackoverflow.com/questions/10523433/+ lastTab +""]').tab('show');
    }
});

Leave a Comment