如果这对任何人来说都很重要，下面的代码很小，工作完美无缺，从URL中获得一个哈希值并显示:

<script>
    window.onload = function () {
        let url = document.location.toString();
        let splitHash = url.split("#");
        if (splitHash[1]) {document.getElementById(splitHash[1]).click();}
    };
</script>

它所做的是检索id并触发单击事件。简单。

基于Peter的回答，并结合https://stackoverflow.com/a/901144/1604205，下面是JS中的代码:

<script>
    const params = new Proxy(new URLSearchParams(window.location.search), {
        get: (searchParams, prop) => searchParams.get(prop),
    });
    $activetabhome = (params.activeTab === null || params.activeTab == 'home') ? 'class="active"' : '';
    $activetabprofile = (params.activeTab == 'profile') ? 'class="active"' : '';
</script>
<li $activetabhome><a href="#home">Home</a></li>
<li $activetabprofile><a href="#profile">Profile</a></li>

我不太喜欢“如果……否则”;所以我采取了更简单的方法。

$(document).ready(function(event) {
    $('ul.nav.nav-tabs a:first').tab('show'); // Select first tab
    $('ul.nav.nav-tabs a[href="'+ window.location.hash+ '"]').tab('show'); // Select tab by name if provided in location hash
    $('ul.nav.nav-tabs a[data-toggle="tab"]').on('shown', function (event) {    // Update the location hash to current tab
        window.location.hash= event.target.hash;
    })
});

选择一个默认选项卡(通常是第一个) 切换到tab(如果确实存在这样的元素;让jQuery来处理它);如果指定了错误的散列，则什么也不会发生 [可选]如果手动选择了其他选项卡，则更新哈希

不处理滚动到所请求的散列;但这应该吗?

下面是我所做的，非常简单，并且提供你的标签链接有一个与它们相关的ID，你可以获得href属性，并将其传递给显示标签内容的函数:

<script type="text/javascript">
        jQuery(document).ready(function() {
            var hash = document.location.hash;
            var prefix = "tab_";
            if (hash) {
                var tab = jQuery(hash.replace(prefix,"")).attr('href');
                jQuery('.nav-tabs a[href='+tab+']').tab('show');
            }
        });
        </script>

然后在你的url中，你可以像这样添加散列:#tab_tab1， 'tab_'部分从散列本身中删除，因此在nav-tabs (tabid1)中实际的标签链接的ID被放在后面，所以你的url看起来像:www.mydomain.com/index.php#tab_tabid1。

这对我来说是完美的，希望它能帮助其他人:-)

@flynfish + @Ztyx解决方案，我用于嵌套选项卡:

    handleTabLinks();

    function handleTabLinks() {
        if(window.location.hash == '') {
            window.location.hash = window.location.hash + '#_';
        }
        var hash = window.location.hash.split('#')[1];
        var prefix = '_';
        var hpieces = hash.split('/');
        for (var i=0;i<hpieces.length;i++) {
            var domelid = hpieces[i].replace(prefix,'');
            var domitem = $('a[href=#' + domelid + '][data-toggle=tab]');
            if (domitem.length > 0) {
                domitem.tab('show');
            }
        }
        $('a[data-toggle=tab]').on('shown', function (e) {
            if ($(this).hasClass('nested')) {
                var nested = window.location.hash.split('/');
                window.location.hash = nested[0] + '/' + e.target.hash.split('#')[1];
            } else {
                window.location.hash = e.target.hash.replace('#', '#' + prefix);
            }
        });
    }

儿童应该有class="nested"

更新

对于Bootstrap 3，将.on(' shows '，…)更改为.on('show .bs。选项卡”,…)

这是基于@dubbe的答案和这个SO接受的答案。它处理window.scrollTo(0,0)不正确工作的问题。问题是，当你替换标签上显示的url哈希时，浏览器将滚动到该哈希，因为它是页面上的一个元素。要解决这个问题，可以添加一个前缀，这样哈希就不会引用实际的页面元素

// Javascript to enable link to tab
var hash = document.location.hash;
var prefix = "tab_";
if (hash) {
    $('.nav-tabs a[href="'+hash.replace(prefix,"")+'"]').tab('show');
} 

// Change hash for page-reload
$('.nav-tabs a').on('shown', function (e) {
    window.location.hash = e.target.hash.replace("#", "#" + prefix);
});

使用实例

如果你有id="mytab"选项卡，你需要把你的链接像这样:

<a href="yoursite.com/#tab_mytab">Go to Specific Tab </a>