正在尝试使用引导导航栏切换

Attempting to use Bootstrap navbar toggle

本文关键字：导航更新时间：2023-09-26

我正试图使用bootstraps导航栏切换，因此当在ipad或手机上查看我的网站时，导航将被折叠，并出现切换按钮。现在我的导航栏崩溃了，但它没有显示切换按钮。这是我目前正在使用的代码。

<div class="row navbar">
    <div class="col-md-12">
        <nav  id="menu1"  class="navbar" role="navigation">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
            <?php wp_nav_menu( array( 'theme_location' => 'main-menu',
                                    'depth' => 2,
                                      'container_class' => 'collapse navbar-collapse',
                                     'menu_class' => 'nav nav-pills nav-justified',
                                    'walker' => new wp_bootstrap_navwalker() )); ?>
        </nav>
    </div>
</div>

这里有一个小提琴，说明了实现这一目标的标准语法：基本Bootstrap 3 Navbar 的小提琴

以及相应的HTML:

  <!-- Navigation -->
    <nav class="navbar navbar-default" role="navigation">
        <div class="container">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
        </div>

你把引导程序JavaScript文件的链接放好了吗

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

如果是，您使用的是完整的JavaScript文件还是只包含一些组件的文件？响应导航栏要求崩溃插件包含在您的Bootstrap版本中

希望这能帮助