引导导航栏上的下拉菜单无法正常工作答案

【问题标题】：dropdown on bootstrap navbar not working properly引导导航栏上的下拉菜单无法正常工作
【发布时间】：2026-02-18 10:25:02
【问题描述】：

我有一个引导导航栏。它正在许多页面上使用。所以我创建了一个 navbar.php，它包含导航栏的元素。我在所有页面上都包含它。但是导航栏的下拉部分无法正常工作。它没有带我到所需的页面。所有引用 home.php 的链接都在工作。登录下拉菜单也有效。但是当我点击它时，它不会带我进入 login.php 或 masterlogin.php 可能是什么问题？

navbar.php

<html>
<head>
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<script src="assets/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>                        
                </button>
                <a class="navbar-brand" href="home.php"><img src="logo3.png" alt="Home"></a>
            </div>
            <div class="collapse navbar-collapse" id="myNavbar">
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="home.php#content1">Content1</a></li>
                    <li><a href="home.php#content2">Content2</a></li>
                    <li><a href="home.php#content3">Content3</a></li>
                    <li><a href="home.php#content4">Content4</a></li>
                    <li><a href="home.php#content5">Content5</a></li>
                    <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">LOGIN<span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="login.php">LOGIN</a></li>
                            <li><a href="masterlogin.php">MASTER LOGIN</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
</body>
</html>

home.php

<!--At the top-->
<?php
include_once "navbar.php";
?>
<!-- Followed by rest of the code for home.php-->

【问题讨论】：

可能忘记添加javascript了？
javascript 也在那里。忘了把它添加到我的问题中。对不起。但它仍然无法正常工作。
尝试将role="navigation" 添加到
节点。参见bootstrap themes的源代码
不，先生。添加了角色=“导航”。它仍然无法正常工作。
你能创建JsFiddle 吗？

标签： php twitter-bootstrap

【解决方案1】：

替换你的css js

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

它在你的代码中工作

【讨论】：

是的，我从来没有看到错误的顺序... jQuery first... if("undefined"==typeof jQuery)throw new Error("Bootstrap's JavaScript requires jQuery"); 奇怪的是他没有收到那个消息...？