Javascript 在mobile resolution上已打开引导下拉列表

我在一个网站上使用引导，导航是引导响应的导航栏。它可以正常折叠，但当我单击按钮打开它时，下拉列表已经打开

如果我轻敲它们，它们就关不上了，或者说

以下是导航的代码：

<div class="navbar-inner" id="navigradi">
    <div class="container">
    <a class="brand pull-right navbar-text" href="<?php echo home_url(); ?>/">
     <img src="http://materia.hurttiajahuumoria.fi/hh-logo-smaller.png" alt="Hurttia & Huumoria"  class="hidden-phone hidden-tablet"/>       
     <span class="hidden-desktop">Hurttia & Huumoria</span>   
      </a>

      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>
    <nav class="nav-main nav-collapse collapse" role="navigation">
        <?php
          if (has_nav_menu('primary_navigation')) :
            wp_nav_menu(array('theme_location' => 'primary_navigation', 'menu_class' => 'nav'));
          endif;
        ?>
      </nav>  
    </div> 
  </div>

---

这看起来像是Bootstrap v2.1.1中的一个bug

我比较了你的网站和我自己的网站的CSS，发现与

相关的CSS有

显示：block。2.1.1中的CSS是：

@media (max-width: 979px)
.nav-collapse .dropdown-menu {
position: static;
top: auto;
left: auto;
display: none;
float: none;
max-width: none;
padding: 0;
margin: 0 15px;
background-color: transparent;
border: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

但是，我使用的是2.3.0，用于
下拉菜单的CSS类具有
显示：无如图所示：

@media (max-width: 979px)
.nav-collapse .dropdown-menu {
position: static;
top: auto;
left: auto;
display: none;
float: none;
max-width: none;
padding: 0;
margin: 0 15px;
background-color: transparent;
border: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}

你可以做几件事。覆盖引导CSS并设置
display:none
用于此特定的
@介质（最大宽度：979px）
查询，如v2.3.0中所述。或者，您可以简单地尝试将整个引导版本更新为最新版本。这是我首先要尝试的

让我知道你的决定。对结果感兴趣。
您能将生成的HTML放在JSFIDLE中，这样我们就可以看到该问题的一个实例吗？您是否使用移动设备来获得上述不理想的结果？如果是，是什么设备和版本？我看了Chrome和IE9，一切看起来都很好。@MichaelFreake我认为你不明白这个问题。问题是导航中的所有下拉列表都已打开，并且会生成一个很长的列表。很抱歉，我无法帮助您，因为您看到的与我看到的完全不同：请尝试调整浏览器窗口的大小以匹配移动分辨率。你将得到与我相同的分辨率。好吧，css解决方案关闭下拉列表，但也使它们不可惩罚。今天晚些时候，我会看看这个。（现在是凌晨2:14）。谢谢除了
显示之外，可能还有其他不同之处：我发现没有
，所以我仍然认为你最好的选择是更新到一个更新版本的Bootstrap。问题是该站点是实时的，并且一些布局代码也是在Bootstrap.css中生成的。我更新了Bootstrap-responsive.css，下拉列表也正常工作！令人惊叹的！做得好。这是我在上面的答案中的建议，所以如果你觉得这个答案适用，请随意接受。干杯