Bootstrap show/open tabs based on url hash

Bootstrap tabs can be switched based on url hash. Bootstrap has provided a jQuery method to open/show tabs programmatically. As we know manual selection of tabs will display appropriate content associated with that particular tab, but to open bootstrap tabs based on url hash follow this blog post by w3schools100

How to add URL hash with a tag

To add URL hash with anchor tag. just append hash value at the end of URL. Example https://w3schools100.blogspot.com/#myCustomHash

Get URL hash using javascript

The syntax to get URL hash is window.location.hash;. By using this, we can identify which tab to be opened.

Open bootstrap tab by jQuery

To open bootstrap tab by the function provided by bootstrap javascript, use $('.nav-tabs a[href="#myCustomHash"]').tab('show'). How to open bootstrap tab by URL hash - Example

How to open bootstrap tab by URL hash - Example

var hash = window.location.hash;
if(hash != '' || hash != undefined)
$('ul.nav a[href="' + hash + '"]').tab('show');