Question

我正在为 WordPress 开发一个自定义主题，目前我正在使用响应式导航栏。它向我展示了切换图标，但当我点击它时什么也没有发生。

我正在使用最新版本的引导程序，直接从网站下载...

我在标题上加载了 jquery：

<script type='text/javascript' src='http://localhost/eltecnofilo/wp-includes/js/jquery/jquery.min.js?ver=3.5.1' id='jquery-core-js'></script>
<script type='text/javascript' src='http://localhost/eltecnofilo/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.3.2' id='jquery-migrate-js'></script>

在页脚上是引导文件：

<script type='text/javascript' src='http://localhost/eltecnofilo/wp-content/themes/ElTecnofilo/bootstrap/js/bootstrap.js?ver=5.0.0' id='bootstrap-js'></script>
<script type='text/javascript' src='http://localhost/eltecnofilo/wp-content/themes/ElTecnofilo/bootstrap/js/bootstrap.esm.js?ver=5.0.0' id='bootstrap-esm-js'></script>
<script type='text/javascript' src='http://localhost/eltecnofilo/wp-content/themes/ElTecnofilo/bootstrap/js/bootstrap.bundle.js?ver=5.0.0' id='bootstrap-bundle-js'></script>

这是我的导航栏代码

<div class="row full-width black-bg">
    <nav class="navbar navbar-expand-md navbar-dark">
        <button type="button" class="navbar-toggler collapsed" data-toggle="collapse" data-target="#collapse-target aria-expanded="false" aria-controls="navbar"">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="collapse-target">
            <ul class="nav navbar-nav">
                <?php
                    $getMenu = wp_get_nav_menu_items( 'menu principal'); // Where menu1 can be ID, slug or title
                    foreach($getMenu as $item){
                        echo '<li class="nav-item"><a class="nav-link" href="' . $item->url . '">' . $item->title . '</a></li>';
                    }
                ?>
            </ul>
        </div>
    </nav>
</div>

有什么想法可能出问题了吗？

Answer 1

引导文件

https://getbootstrap.com/docs/5.0/getting-started/introduction/

<块引用>

我们的许多组件都需要使用 JavaScript 才能运行。具体来说，它们需要我们自己的 JavaScript 插件和 Popper。将以下之一放在页面末尾附近，对在结束标记之前，启用它们。

请记住，Bootstrap 的动态功能依赖于 Jquery 和 Popper.js。

我在您的脚本文件中没有看到 Popper.js，请尝试包含它。

https://popper.js.org/

Bootstrap 响应式导航栏切换按钮不起作用

1 个答案:

引导文件