引导下拉菜单不下拉答案

【问题标题】：Bootstrap dropdown menu doesn't dropdown引导下拉菜单不下拉
【发布时间】：2018-09-21 05:16:02
【问题描述】：

我有点“麻烦”。我似乎无法使用此下拉菜单，我已经阅读并阅读并找不到解决方案。它什么都不做，不下拉。如果有人可以帮我一点忙，我会很高兴。

<div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
            <li class="nav-item active">
                <a class="nav-link" href="index.html">Home<span class="sr-only">(current)</span></a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Quem Sou?</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Exercício 1</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Exercício 2</a>
            </li>
            <li class="nav-item dropdown">
               <button class="btn nav-item dropdown-toggle" id="dropdownMenuButton" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                   Dropdown
               </button>
               <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                   <a class="dropdown-item" href="#">Action</a>
                   <a class="dropdown-item" href="#">Another action</a>
                   <a class="dropdown-item" href="#">Something else here</a>
                </div>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Exercício 3</a>
            </li>
        </ul>
        <form class="form-inline my-2 my-lg-0">
            <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
            <button class="btn btn-outline-primary my-2 my-sm-0" type="submit">Search</button>
        </form>
    </div>

编辑：这是我的标题，因为你们都在指望我拥有链接

<head>
    <meta charset="UTF-8">
    <link href="styles.css" type="text/css" rel="stylesheet">
    <title>Ana Rodrigues</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-grid.css">
    <link rel="stylesheet" href="css/bootstrap-grid.min.css">
    <link rel="stylesheet" href="css/bootstrap-reboot.css">
    <link rel="stylesheet" href="css/bootstrap-reboot.min.css">
    <link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Just+Another+Hand" rel="stylesheet">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

【问题讨论】：

你能用这个贴小提琴或密码笔吗？我可能会提供帮助，但我懒得设置所有这些 XD

标签： html css drop-down-menu bootstrap-4

【解决方案1】：

看看这个网站，你会发现问题： https://getbootstrap.com/docs/4.0/components/dropdowns/
不要忘记在标题中添加引导程序，否则您可能忘记下载引导程序文件然后使用您的代码。此外，如果您在标题中使用它，则必须连接到互联网。

【讨论】：

我有链接，我已经连接到互联网，我会去那个网站看看

【解决方案2】：

您是否将 Bootstrap JS 和 jQuery 导入到您的项目中？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://getbootstrap.com/docs/4.0/dist/js/bootstrap.min.js"></script>

【讨论】：

我在标题中找到了
还有下拉JS文件？ bootstrap-4.0.0/js/src/dropdown.js
或者你的学士课程
删除了许多引导类或忘记添加它们。 codepen.io/edgarMejia/pen/xaMNRQ

【解决方案3】：

确保您包含使所有引导程序组件正常工作所需的所有 Javascript 文件，正如 @saeed 所说，在链接上您会找到以下内容：

" Dropdowns 是基于第三方库 Popper.js 构建的，它提供动态定位和视口检测。一定要在 Bootstrap 的 JavaScript 之前包含 popper.min.js 或使用 bootstrap.bundle.min.js / bootstrap.bundle .js 包含 Popper.js。虽然不需要动态定位，但 Popper.js 不用于在导航栏中定位下拉菜单。

如果您从源代码构建我们的 JavaScript，它需要 util.js。 "

编辑：

您确定包含了 jquery JS 文件吗？

【讨论】：

是的，我知道了
也许您没有为下拉菜单使用正确的类？就像第一个示例在引导网页上所说的那样？

操作另一个动作这里有别的东西
我尝试复制并粘贴第一个示例中的代码并得到相同的结果