Twitter引導程序導航崩潰

這是我的代碼的樣子，但問題是：當我單擊摺疊按鈕（具有4條水平線的那個）時，它不會在第一次點擊時打開，而只會在第第二次點擊。第一次點擊什麼也不做，第二次快速打開它比快速關閉它要重新打開它。爲什麼是這樣以及如何解決它？Twitter引導程序導航崩潰

22  <!-- BOOTSTRAP NAVBAR --> 
23  <div class="navbar navbar-fixed-top"> 
24  <div class="navbar-inner">   
25   <div class="container"> 
26 
27   <a class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse">             
28    <span class="icon-bar"></span> 
29    <span class="icon-bar"></span> 
30    <span class="icon-bar"></span> 
31    <span class="icon-bar"></span> 
32   </a> 
33  
34   <%= link_to 'Synergy', root_path, :class => 'brand' %>                   
35 
36   <div class="nav-collapse">                        
37 
38    <% if current_user %>                           
39 
40    <ul class="nav"> 
41     <li><%= link_to 'My projects', projects_path %></li> 
42     <li><%= link_to current_user.name, '#' %></li> 
43     <li><%= link_to 'Log out', destroy_user_session_path, :method => :delete %></li> 
44    </ul>   
45 
46    <% else %>  
47 
48    <ul class="nav"> 
49     <li><%= link_to 'Sign in', new_user_session_path %></li> 
50     <li><%= link_to 'Sign up!', new_user_registration_path %></li> 
51    </ul>   
52 
53    <% end %>  
54 
55   </div>   
56 
57   </div>    
58  </div>    
59  </div> 
60  <!-- BOOTSTRAP NAVBAR -->

編輯：這是我的application.js文件：

13 //= require jquery 
14 //= require jquery_ujs 
15 //= require jquery-ui 
16 //= require twitter/bootstrap 
17 //= require_tree .

來源

2012-05-15 oFca

爲什麼你在另一個容器中嵌套你的導航崩潰？只有一個是必須的，''div class =「container nav-collapse」>'從這個div中移除'container'類，同樣，你的js加載的順序是什麼？ –

謝謝。我已經編輯了這個問題，因爲我瞭解你解決了我的問題。這是你想到的嗎？另外，我的JS加載在文件的末尾，正好在標記的上方，並且我只有這一行><％= javascript_include_tag「application」％>。我應該重新排列某些東西嗎 – oFca

另一個js加載的問題，因爲這個特性需要下拉插件，因此應該在jquery插件之後加載。所以，jQuery首先> bootstrap.js第二個 - 或者如果你包含單獨的插件，它首先進入transition.js插件，然後是下拉插件。 –

這聽起來像你是雙裝載一些JS文件。很容易忘記在Ruby或Grails等環境中加載文件的位置。

嘗試在頁面腳本中包含對Jquery的調用，並在調用後直接放置內聯腳本。例如：

<script src="js/jquery.js" type="text/javascript"></script> 
<script src="js/bootstrap-carousel.js" type="text/javascript"></script> 
<script src="js/bootstrap-transition.js" type="text/javascript"></script> 
<script> 

$(document).ready(function() { 
    $('#myCarousel').carousel(); 
    }); 
</script>

添加此腳本後，請在Firebug或其他開發人員工具中檢查Web控制檯。你應該看看jQuery是否正確加載或多次加載。讓我知道如果解決了這個問題:)

來源

2013-07-19 16:03:32 Nathan

在我的情況下，類似的情況發生了，因爲我以前爲生產預先編譯了我的資產，並且dev和prod js資產都在運行。

rake assets:clean（rails3）/ rake assets:clobber（rails4）解決了這個問題。

來源

2016-05-03 23:33:13 vaughanos

Twitter引導程序導航崩潰

回答

相關問題