bootstrap 导航在响应模式下不起作用

Question

我有这段代码，但它在响应模式下不起作用。我的意思是该按钮会出现，但是当我单击该按钮时，我的导航栏不会出现。我不知道这是关于什么的。 css 并且 js 文件也添加到文档中，但它仍然不起作用。对此问题的任何提示将不胜感激。

<!DOCTYPE html>
<html>
<head>

<meta charset="UTF-8">

<!-- ------------------------------bootstrap css link--------------------- -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.css">
<link rel="stylesheet" type="text/css" href="css/custom-css.css">

</head>
<body>



    <div class="row">
        <div class="col-md-12 top-site">

                <div class="top-bg col-md-12">
                </div>

                <!-- <div class="col-md-2 social">


                </div>
                <div class="col-md-2 search">

                </div> -->

                <div class="row">
                    <nav class="navbar navbar-default" role="navigation">
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#collapse">
                                <span class="sr-only">Toggle navigation</span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>
                        </div>
                        <div class="collapse navbar-collapse" id="collapse">
                            <ul class="nav navbar-nav">
                                <li><a href="">خانه</a></li>
                                <li><a href="">تماس با ما</a></li>
                                <li><a href="">لینک به ما</a></li>
                                <li><a href="">درباره ما</a></li>
                                <li><a href="">تبلیغات در سایت</a></li>
                            </ul>
                        </div>
                    </nav>
                </div>


        </div>
    </div>

<div class="container"> 
    <div class="row">
    </div>

</div>



<!-- ------------------------------bootstrap css link--------------------- -->
<script type="text/javascript" src="bootstrap.js"></script>
<script type="text/javascript" src="npm.js"></script>
<script type="text/javascript" src="jquery-2.1.0.min.js"></script>

</body>
</html>

Answer 1

jQuery 库应该包含在之前 bootstrap.

<script type="text/javascript" src="jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="bootstrap.js"></script>

bootstrap 导航在响应模式下不起作用

bootstrap navigation doesn't work in responsive mode

uinavigationbar

twitter-bootstrap-3