Question

我使用Python Flask，Jinja 2和Boostrap 4来开发一个简单的网络工具但是我坚持一个奇怪的问题，我认为必须是＆＃34; nav-之间的链接错误项＆＃34;和一个＆＃34; tabpanel＆＃34;但对于我的生活，我似乎无法找到问题所在。以下是我用于HTML中标签的代码。

<div id="tabs">
  <ul class="nav nav-tabs" role="tablist">
    <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#m-tab" role="tab">M</a></li>
    <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#g-tab" role="tab">G</a></li>
    <li class="nav-item"><a class="nav-link" data-toggle="tab" href= "#p-tab" role="tab">P</a></li>
  </ul>
<div class="tab-content">
  <div class="tab-pane active" id="m-tab" role"tabpanel">
    ....... <!-- Content -->
  </div>
  <div class="tab-pane" id="g-tab" role="tabpanel">
    ....... <!-- Content -->
  </div>
  <div class="tab-pane" id="p-tab" role="tabpanel">
    ....... <!-- Content -->
  </div>
</div>

前两个标签m-tab and g-tab完美无缺，但当我选择p-tab时，显示的内容不会从g-tab tabpanel更改。似乎第二个和第三个选项卡都显示与URL更新相同的内容，以显示哪个选项卡处于活动状态，该部分正确反映了我所做的选择。

我必须遗漏一些简单的东西，但我需要第二双眼睛！非常感谢任何和所有的帮助！

提前致谢！

两个选项卡在Bootstrap 4

0 个答案: