bootstrap4下拉菜单在我单击时仅工作一次

时间:2019-05-28 11:41:06

标签: html bootstrap-4

我的网页上有一个下拉菜单。但是它仅显示菜单项一次。 ie-仅在我第一次单击时显示菜单项。如果我再次重新加载页面,那么它将再次起作用。以下是我为下拉菜单编写的代码。

<!-- Dropdown -->
    <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown">
        Shop
      </a>
      <div class="dropdown-menu">
        <a class="dropdown-item" href="#">Shoes</a>
        <a class="dropdown-item" href="#">Handbags</a>
      </div>
    </li>

谢谢。

这是我的标题代码

<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/main.css">
<title>My title</title>

1 个答案:

答案 0 :(得分:0)

role="button"添加到您的切换链接:

<a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown" role="button">Shop</a>

此外,请确保已在代码中加载了Bootstrap JS文件。