引导程序选项卡的URL，未指向正确的选项卡

Question

I've seen a few of related questions arround here, but I couldn't find a solution for me so far.

Here's the thing: I have a tab section with the same structure as this and it's working just fine. But if I create an URL to, let's say, the second tab, like this www.example.com/path/to#tab2 it takes me to the default tab, tab1.

In my research, I read that something this could be a solution:

$(function(){
  var hash = window.location.hash;
  hash && $('ul.nav a[href="' + hash + '"]').tab('show');

  $('.nav-tabs a').click(function (e) {
    $(this).tab('show');
    var scrollmem = $('body').scrollTop();
    window.location.hash = this.hash;
    $('html,body').scrollTop(scrollmem);
  });
});

After that, if I go to www.example.com/path/to and navigate the tabs, they are working as before, however, if I go directly to this url www.example.com/path/to#tab2 , I get this error in the console:

Uncaught TypeError: $(...).tab is not a function

And as far as I know, that's a problem with Jquery loading, which makes no sense to me because my .js file already has jquery functions and they are working.

Jquery version: 1.12.4;

Bootstrap version: 3.3.5;

Answer 1

Actually found the answer myself, this is what I did:

var hash = document.location.hash;
var prefix = '/';

if (hash) {
  $('.nav-tabs a[href="' + hash.replace(prefix, '') + '"]').tab('show');
}

I was close to make it work, just wasn't using the correct prefix before.