引导程序3导航选项卡书签url不工作

Bootstrap 3 Nav Tabs bookmark url not working

本文关键字：url 工作 书签 导航 选项 引导程序      更新时间：2023-09-26

使用Wordpress&Bootstrap 3-我的导航标签书签链接不起作用
我发现了许多（不同的）JavaScript&jQuery，但到目前为止还没有。

我的HTML:

<ul class="nav nav-tabs" role="tablist" id="myTab">
  <li class="active"><a href="#home" role="tab" data-toggle="tab">Home</a></li>
  <li><a href="#profile" role="tab" data-toggle="tab">Profile</a></li>
  <li><a href="#messages" role="tab" data-toggle="tab">Messages</a></li>
  <li><a href="#settings" role="tab" data-toggle="tab">Settings</a></li>
</ul>
<div class="tab-content">
  <div class="tab-pane active" id="home">...</div>
  <div class="tab-pane" id="profile">...</div>
  <div class="tab-pane" id="messages">...</div>
  <div class="tab-pane" id="settings">...</div>
</div>

我希望能够输入/访问一个URL，比如www.mysite.com/example#messages，然后登录www.mysitecom/example页面（包含选项卡），打开#messages选项卡。

我只是无法打开一个不同的选项卡，因为其中没有.active类。StackOverFlow上有很多以前的例子，但（到目前为止）都不适合我。

我已经按照指示&根据Bootstrap网站进行标记：http://getbootstrap.com/javascript/#tabs

还没有运气。

有什么想法吗
感谢这些提示！

$(document).ready(function() {        
    var url = document.location.toString();
    if (url.match('#')) {
        $('.nav-tabs a[href="#' + url.split('#')[1] + '"]').tab('show');
    }
});

这就行了但它也会进入#tabid的书签。。。。查找如何不…

相关文章：