Question

我正在尝试使用bootstrap示例完成一个简单的下拉菜单，但是当我单击它时它没有响应任何内容。我已经搜索过这个问题，并没有一个解决方案帮助我（即将链接放在头部或不同顺序的资源）。不要介意角度代码

这是html。

<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <!-- Bootstrap style -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
    <!-- express style that I like-->
    <link rel="stylesheet" href="stylesheets/style.css" />
    <title>Pharmpool NIH | Express</title>
</head>
<body ng-app="nihApp">

    <h1>PharmPool on nih Express</h1>
    <br />
    <div ng-controller="MainController">

        <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                Dropdown
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li><a href="#">Separated link</a></li>
            </ul>
        </div>

    </div>

    <!-- jQuery and Angular -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
    <!-- Bootstrap js -->
    <script type="javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <!-- angular code[controller] -->
    <script type="text/javascript" src="javascripts/controller.js"></script>
    <script type="text/javascript" >
        $(document).ready(function() {
            $('.dropdown-toggle').dropdown();
        });
    </script>
</body>
</html>

以下是控制台错误：

Uncaught TypeError: $(...).dropdown is not a function

感谢任何帮助。谢谢，Alon

Answer 1

您在脚本代码中错过了一件type="text/javascript"。

这就是dropdown无效的原因..

你的脚本标签。

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

应该是

<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

Bootstrap下拉不起作用

1 个答案: