引导选项卡的 URL，不会指向正确的选项卡答案

【问题标题】：URL for bootstrap tab, doesn't lead to the correct tab引导选项卡的 URL，不会指向正确的选项卡
【发布时间】：2018-03-16 14:01:22
【问题描述】：

我在这里看到了一些相关的问题，但到目前为止我找不到适合我的解决方案。

事情是这样的：我有一个tab 部分，其结构与this 相同，它工作得很好。但是，如果我创建一个指向第二个选项卡的 URL，例如 www.example.com/path/to#tab2，它会将我带到默认选项卡 tab1。

在我的研究中，我读到这可能是一个解决方案：

$(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);
  });
});

之后，如果我转到 www.example.com/path/to 并导航选项卡，它们会像以前一样工作，但是，如果我直接转到此 URL www.example.com/path/to#tab2，我会在控制台中收到此错误：

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

据我所知，这是 Jquery 加载的问题，这对我来说毫无意义，因为我的 .js 文件已经具有 jquery 函数并且它们正在工作。

jquery版本：1.12.4；

引导版本：3.3.5；

【问题讨论】：

Try this（从您共享的 Pen 中分叉）。
@SallyCJ 不错，但在访问其他选项卡 URL 时，或者换句话说，当您刷新页面时，它会转到默认选项卡
你确定吗？自从我发表评论以来，我实际上已经改变了它（几次）。尝试创建一个简单的 HTML 模板（仍然是一个有效的模板）并将所有 HTML 和 JS 脚本放入该文件中。然后，如果您愿意，可以从您的本地开发站点甚至实时站点对其进行测试。
@SallyCJ 对不起，我的意思是说它会转到我的开发网站上的默认选项卡，即使它在你的笔上工作正常
实际上，该脚本运行良好（至少在 Edge 上）。 Download this HTML file 并从您的浏览器打开它，无论是否从http:// URL 访问它（即是否将其上传到您的服务器/站点）。（HTML 与我在 Pen 上使用的不同。）

标签： javascript jquery twitter-bootstrap-3

【解决方案1】：

其实自己找到了答案，我就是这样做的：

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

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

我已经接近让它工作了，只是之前没有使用正确的前缀。

【讨论】：