Twitter bootstrap 单击引导移动菜单时，它不会打开_Twitter Bootstrap_Mobile_Menu

Twitter bootstrap 单击引导移动菜单时，它不会打开

twitter-bootstrap mobile menu

Twitter bootstrap 单击引导移动菜单时，它不会打开,twitter-bootstrap,mobile,menu,Twitter Bootstrap,Mobile,Menu,我已经读了好几篇关于同一个问题的文章，但都没能解决我的问题，所以我把这篇文章贴在这里。我的代码在桌面上运行良好，并且在手机上显示菜单按钮，但它不会在单击它时打开菜单 <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" co

我已经读了好几篇关于同一个问题的文章，但都没能解决我的问题，所以我把这篇文章贴在这里。我的代码在

桌面

上运行良好，并且在

手机

上显示

菜单按钮

，但它不会在单击它时打开菜单

<html lang="en">

  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link href="/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
    <link href="/css/theme.css" rel="stylesheet" type="text/css" media="all" />
    <link href="/css/themify-icons.css" rel="stylesheet" type="text/css" media="all" />
    <link href='http://fonts.googleapis.com/css?family=Lato:300,400%7CRaleway:100,400,300,500,600,700%7COpen+Sans:400,500,600' rel='stylesheet' type='text/css'>

    <!-- In-lining styles to avoid needing a separate .css file -->
    <style>
        hr { border-color: #cccccc; margin: 0; }
        .no-margins { margin: 0px; }
        .with-margins { margin: 10px; }
        .col-centered { float: none; margin: 0 auto; }
    </style>
  </head>

<body>
    <div class="nav-container">
        <a id="top"></a>
        <nav>
            <div class="nav-bar">
                <div class="module left">
                    <a href="/">
                        <img alt="Logo" class="logo logo-dark" src="/img/logo.png">
                    </a>
                </div>
                <div class="module widget-handle mobile-toggle right visible-sm visible-xs">
                    <i class="ti-menu"></i>
                </div>

                <div class="module-group right">
                    <div class="module left">
                        <ul class="menu">
                            <li><a href="/menu1">menu1</a></li>
                            <li><a href="/menu2">menu2</a></li>
                        </ul>
                    </div>
                    <!--end of menu module-->

                    <div class="module widget-handle cart-widget-handle left">
                        <div class="cart">
                            <span>username</span>
                            <i class="ti-user has-dropdown"></i>
                        </div>
                        <div class="function">
                            <div class="widget">
                                <ul class="cart-overview">
                                    <li>
                                        <a href="/profile">
                                            <div class="description">
                                                <span>Profile</span>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="/log-out">
                                            <div class="description">
                                                <span>Log out</span>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <!--end of widget-->
                        </div>

                    </div>
                </div>



            <!--end of module group-->
        </div>
    </nav>
</div>

<div id="main-div" class="with-margins">
    <section>
    ...
    </section>
</div>

<footer>
...
</footer>

<link href="/js/jquery.min.js" rel="stylesheet" type="text/css" media="all" />
<link href="/js/bootstrap.min.js" rel="stylesheet" type="text/css" media="all" />
<link href="/js/scripts.js" rel="stylesheet" type="text/css" media="all" />


</body>
</html>


hr{边框颜色：#cccccc；边距：0；}
.no页边距{页边距：0px；}
.带边距{边距：10px；}
.col居中{浮点：无；边距：0自动；}




用户名






...
...

不幸的是，我无法让它在JSFIDLE中运行，但我将稍后再试。如果有人能找出代码的错误所在，请提前表示感谢。

好的，找到错误。有点愚蠢，但可能有人会遇到同样的错误，所以我在这里发布解决方案：

无意中，我对

js

文件使用了与

css

文件相同的方法。这就是我所做的，这当然是错误的：

<link href="/js/bootstrap.min.js" rel="stylesheet" type="text/css" media="all" />

这就是它的外观：

<script src="/js/bootstrap.min.js"></script>