我正在按照Bootstrap 4 Beta文档的说明“使用数据属性您可以通过简单地在元素上指定data-toggle =”tab“或data-toggle =”pill“来激活选项卡或药丸导航而无需编写任何JavaScript . 使用这些.nav-tabs或.nav-pills上的数据属性 . “
据此，我不需要任何JS来使它工作 . 如果我更改url以包含哈希示例#profile，则不会显示该选项卡 .
<div class="container">
<!-- Nav tabs -->
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#home" role="tab">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#profile" role="tab">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#messages" role="tab">Messages</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#settings" role="tab">Settings</a>
</li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div class="tab-pane active" id="home" role="tabpanel">...</div>
<div class="tab-pane" id="profile" role="tabpanel">...</div>
<div class="tab-pane" id="messages" role="tabpanel">...</div>
<div class="tab-pane" id="settings" role="tabpanel">...</div>
</div>
</div>
全屏小提琴，直接链接到#profile标签fullscreenFiddle
我还需要使用Js来读取url并获取哈希值吗？使用当前的Beta版本 .