Javascript 如何通过重定向更改所选选项卡

我有以下问题

我正在重定向到下一页http://localhost/accounttab-verification. 一旦用户进入该页面，我希望相应的选项卡处于活动状态

以下是我的一些代码：

<ul class="nav nav-pills" id="profile-tab" role="tablist">
    <li class="nav-item" role="presentation"><a class="nav-link active" id="personal-tab" data-toggle="pill" href="#tab-personal">Personal</a></li>
    <li class="nav-item" role="verification"><a class="nav-link" id="verification-tab" data-toggle="pill" href="#tab-verification">ID Verification</a></li>
</ul>
<br>
<hr />
<br>
<div class="tab-content" id="pills-tabContent">
    <div class="tab-pane fade show active" id="tab-personal" role="tabpanel" aria-labelledby="personal-tab">
    
    </div>
    <div class="tab-pane fade" id="tab-verification" role="tabpanel" aria-labelledby="verification-tab">
    
    </div>
</div>

以下是我在页面底部包含的JS代码：

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script type="text/javascript">
$(function () {
    ...
    var tabId = window.location.hash;
    // Select the tab
    // $('#profile-tab a:last').tab('show');
    $('#profile-tab a[href="' + tabId + '"]').tab('show');
});
</script>

我尝试了不同的选项，但没有人将另一个选项卡设为默认活动选项卡。

---

控制台中也没有错误。我假设问题出在附带的bootstrap/jquery上？

我可以通过使用您提供的代码中的注释行来生成所需的结果，如下所示。也许有其他的背景可以解释你的问题

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script type="text/javascript">
$(function () {
    $('#profile-tab a:last').tab('show');
});
</script>

---

下面的代码段正在工作，活动选项卡窗格的类为选项卡窗格淡入活动，活动导航项目的类为活动导航项目活动。导航链路不需要任何活动类

$function{ var tabId=window.location.hash； //选择选项卡 //$'profile-tab a:last'。tab'show'； $'profile-tab a[href='+tabId+']'。tab'show'； }; 个人标签 标签验证

---

您应该能够触发对选项卡的单击

<script>
  $(function () {
    ...
    var tabId = window.location.hash;
    // Click the tab
    $('#profile-tab a[href="' + tabId + '"]').click();
  });
</script>

---

问题在于css和js引导版本不同。 一旦我解决了这个问题，这就是正常工作所需的代码：

var tabId = window.location.hash;
var firstTabEl = document.querySelector('#profile-tab a[href="' + tabId + '"]');
var firstTab = new bootstrap.Tab(firstTabEl);
firstTab.show();

---

您的选项卡基于活动类active，请将其应用于正确的选项卡。加载页面时，您是否获得了tabId的值？问题陈述不仅仅是显示选项卡，而是在页面在我的网站上意外加载后提供活动类，该网站不起作用。随着类的更改，它也不会显示活动选项卡。我正在使用这个引导版本：这可能是原因吗？我认为css是引导版本v5。*。上面的代码段使用的是bootstrap 3.3.7，因此bootstrap js和css的版本相同。我在提供的代码中看到，bootstrap js的cdn是v3.7.7版本，所以css也是v3.7.7版本。