引导选项卡不会停用

Bootstrap tabs don't deactivate

本文关键字:选项      更新时间:2023-09-26

我使用的选项卡组件从Bootstrap,它似乎工作得很好,但当我去一个选项卡,然后离开它,选项卡保持活动类。所以当我把它们都看完时,它们就不起作用了。这是我的代码(我用的是Django)

<ul id="question-tabs" class="nav nav-tabs nav-justified" role="tablist" data-tabs="question-tabs">
    <li role="presentation" class="active"><a href="#latest" data-toggle="tab">Latest</a></li>
    <li role="presentation"><a href="#unans" data-toggle="tab">Unanswered <span class="badge">{{ total_noans }}</span></a></li>
    <li role="presentation"><a href="#reward" data-toggle="tab">Most Rewarding <span class="badge">{{ reward | length }}</span></a></li>
</ul>

我没有发现问题,我尝试使用JS片段Bootstrap提供…

$('#question-tabs a').click(function (e) {
  e.preventDefault()
  $(this).tab('show')
})

…但这并没有奏效。这可能是一件愚蠢的事情,但我想不明白。谢谢你的帮助。

如果你想要一个我所说的活生生的例子,去https://seoq.swapps.io/qa/

只需将代码包装在您的页面特定(project.js)脚本中。我希望这将解决问题:

$(function(){
  $('#question-tabs a').click(function (e) {
    e.preventDefault()
    $(this).tab('show')
  });
});

享受:)

是的,这是一件愚蠢的事情。在基本模板中,被调用的Bootstrap.js文件是版本4的那个。现在它起作用了。对不起,谢谢大家。