Question

我一直在努力让Bootstrap 3.2中的响应式导航栏与我的网站一起工作，奇怪的是它完美无缺，只要我不包含bootstrap.js文件。看作导航栏的“响应”部分（a.k.a汉堡包按钮）依赖于当导航栏崩溃时存在的这个文件我想让它工作，即使这个讨厌的文件存在。我已经尝试将它放在head-tag内部并且正好在关闭的body-tag之上，但它没有任何区别（而且我也确保将它放在jquery下面。）这是我的导航栏：

<body>
<div id="wrapper">
    <div class="container">
        <!-- RAD 1: Navigation -->
        <header 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="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>                      
                    </button>
                    <a class="navbar-brand" href="index.html">Optalux</a>
                </div>
                <div class="collapse navbar-collapse" id="collapse">                
                    <ul class="nav navbar-nav">
                        <li class="dropdown"><a href="om-optalux.html" class="dropdown-toggle" data-toggle="dropdown">Om Optalux</a>
                            <ul class="dropdown-menu">
                                <li><a href="om-optalux.html#personlig-ogonkirurgi">Personlig Ögonkirurgi</a></li>
                                <li><a href="om-optalux.html#medicinsk-verksamhetschef">Medicinsk Verksamhetschef</a></li>
                                <li><a href="om-optalux.html#lediga-tjanster">Lediga Tjänster</a></li>
                            </ul>
                        </li>                           
                    </ul>
                </div>              
            </nav>
        </header>
    </div>
</div>
<script src="js/jquery.js"></script>
<script src="js/bootstrap.js"></script>
</body>

重复：导航栏在默认模式下工作正常（不折叠），只要我不包含bootstrap.js文件，但没有它，响应模式就没用了。我非常感谢任何帮助，因为这让我疯狂。

Answer 1

从下拉菜单项中删除class和data-toggle属性：

<ul class="dropdown-menu">
  <li><a href="om-optalux.html#personlig-ogonkirurgi">Personlig Ögonkirurgi</a></li>
  <li><a href="om-optalux.html#medicinsk-verksamhetschef">Medicinsk Verksamhetschef</a></li>
  <li><a href="om-optalux.html#lediga-tjanster">Lediga Tjänster</a></li>
</ul>

Bootstrap Dropdown插件会看到data-toggle='dropdown'标记，并尝试将这些项目转换为下拉列表。无论何时单击链接，它都会拦截（并阻止默认行为）。

当包含bootstrap.js时，Bootstrap 3.x导航栏链接无处可寻

1 个答案: