按钮点击Bootstrap，如何切换导航类

Button Click in Bootstrap, how to toggle class of nav?

本文关键字：何切换 导航 Bootstrap 按钮      更新时间：2023-09-26

我正试图在我的一个页面上设置一个向导风格的主题来构建配置文件，我希望能够通过单击"下一步"在引导程序上切换药丸导航的类别，尽管我不完全确定如何做到这一点。我的选项卡布局nav如下：

<!-- Nav tabs -->
<ul class="nav nav-pills" role="tablist">
    <li role="presentation" class="active"><a href="#aaa" aria-controls="aaa" role="tab" data-toggle="tab">aaa</a></li>
    <li role="presentation"><a href="#bbb" aria-controls="bbb" role="tab" data-toggle="tab">bbb</a></li>
    <li role="presentation"><a href="#ccc" aria-controls="ccc" role="tab" data-toggle="tab">ccc</a></li>
    <li role="presentation"><a href="#ddd" aria-controls="ddd" role="tab" data-toggle="tab">ddd</a></li>
</ul>

我的按钮看起来像这样，它们可以工作，但它们不会在相应的nav-pills:上切换"active"类

<a href="#bbb" aria-controls="bbb" role="tab" data-toggle="tab" class="btn btn-success btn-lg bottomright">Next</a>

有没有办法将nav-pills作为切换活动类的目标？

$('.nav-tabs > .active').next('li').find('a').trigger('click');

单击下一个按钮中的JQuery代码可以帮助您将列表中的下一项设置为活动项。此外，我认为您应该从"下一步"按钮中删除href="#bbb"。

相关文章：