Bootstrap导航折叠一次切换

我在我正在开发的网站上有一个可折叠菜单，但折叠只能切换一次。我点击“MENU”菜单展开，再次点击它，菜单关闭，但不会继续切换。Bootstrap导航折叠一次切换

这是我的开发服务器的链接。只需调整浏览器窗口的大小，直到出现“MENU”按钮并单击它。

http://www.corporateprdev.com/ymcakpt

这里是我的菜单结构：

<div class="navbar navbar-fixed-top"> 
    <div class="navbar-inner"> 
    <div class="container"> 
     <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
     MENU 
     </a> 
     <a class="brand" href="/ymcakpt/"><img src="/ymcakpt/themes/responsive/images/y-nav-collapse.png" alt="YMCA::Home" longdesc="images/y-nav-collapse.png" align="left" style="margin-right: 15px;"></a> 
     <div class="nav-collapse"> 
     <ul class="nav"> 
      <li class="active"> 
      <a href="/ymcakpt/">Home</a> 
      </li> 
      <li> 
      <a href="/ymcakpt/index.php/about/" >About</a> 
      </li> 
      <li> 
      <a href="/ymcakpt/index.php/membership/" >Membership</a> 
      </li> 
      <li> 
      <a href="/ymcakpt/index.php/schedules/" >Schedules</a> 
      </li> 
      <li> 
      <a href="/ymcakpt/index.php/contact-us/" >Contact Us</a> 
      </li> 
     </ul> 
     <form class="navbar-search pull-right" action="/ymcakpt/index.php/search/"> 
      <input name="query" type="text" class="search-query" placeholder="Search" style="padding: 2px 8px; margin: 0; width: 210px;"> 
      <input name="Submit" class="submit" type="image" src="/ymcakpt/themes/responsive/images/go-btn.png" value="Go" style="width: 35px; height: 25px;"> 
    </form> 
      </div><!--/.nav-collapse --> 
     </div> 
     </div>

来源

2012-08-14 Anthony Duncan

你的情况的问题是两个JavaScript文件，即引导-transition.js和ccm.app.js之间的碰撞。他们都在写入jQuery变量$.support.transition。 Bootstrap要求该对象包含属性end，该属性包含在CSS3转换结束时触发的浏览器特定事件。另一个文件覆盖support.transition只是一个布尔值。

当hide方法被调用，transitioning设置为true因为这标志着过渡期结束时的名称是不确定的，在transitioning财产永远不会被重置为false。这会导致Collapse插件上的show或hide将来的任何调用都会短路。

您可以尝试修改ccm.app.js以与Twitter Bootstrap的Transitions插件兼容。只需添加一个不覆盖现有值的检查就足够了。

另一种选择是努力确保引导-transition.js之后ccm.app.js加载。只要ccm.app.js只是寻找truthy值，你应该很好。

来源

2012-08-14 20:30:56 merv

我想通了。似乎我有人把我的collapse.js文件与我正在处理的其他网站中的一个文件相关联。重新加载我的原始文件，现在所有功能都正常。 – 2012-08-14 20:55:33

@AnthonyDuncan - 您刚刚将文件从2.0.4恢复为2.0.1，并且我确定的问题仍然存在。您没有看到相同行为的唯一原因是因为2.0.1中的** bootstrap-collapse.js **没有短路功能。但是，由于问题仍然存在，因此'显示'和'隐藏'事件将无法在页面上触发。我强烈建议您使用最新版本的Bootstrap并正确解决您的问题。 – merv 2012-08-14 21:10:32

我有同样的问题，它是由包括JavaScript文件的双重造成的。

我做了包括我的库javascript文件两次，当我删除重复的时候，它工作的很好。

来源

2015-02-23 11:42:47 Ebrahim

Bootstrap导航折叠一次切换

回答

相关问题