引導登錄下拉「點擊」不起作用

Question

我已經研究過這個問題，當我點擊它關閉的表單時，因爲boostrap-dropdown.js，我仍然無法使它工作。不過，我正在按照本指南的說明使用引導程序在導航欄上創建一個登錄dropbdown：Guide，並且它們包含JS以阻止表單關閉，但它不適用於我。

這裏是我的代碼：

<div class="navbar navbar-fixed-top"> 
<div class="navbar-inner"> 
<div class="container"><!-- Collapsable nav bar --> 
<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> 

<!-- Your site name for the upper left corner of the site --> 
<a class="brand"><img name="" src="bglogo.png" alt=""></a> 

<!-- Start of the nav bar content --> 
<div class="nav-collapse"><!-- Other nav bar content --> 

<!-- The drop down menu --> 
<ul class="nav pull-right"> 
<li><a href="https://stackoverflow.com/users/sign_up">Sign Up</a></li> 
<li class="divider-vertical"></li> 
<li class="drop down"> 
<a class="dropdown-toggle" href="#" data-toggle="dropdown">Sign In <strong class="caret"></strong></a> 
<div class="dropdown-menu" style="padding: 15px; padding-bottom: 0px;"> 
<!-- Login form here --> 
<form action="Checklogin.php" method="post" accept-charset="UTF-8"> 
<input id="user_username" style="margin-bottom: 15px;" type="text" name="user[username]" size="30" /> 
<input id="user_password" style="margin-bottom: 15px;" type="password" name="user[password]" size="30" /> 
<input id="user_remember_me" style="float: left; margin-right: 10px;" type="checkbox" name="user[remember_me]" value="1" /> 
<label class="string optional" for="user_remember_me"> Remember me</label> 

<input class="btn btn-primary" style="clear: left; width: 100%; height: 32px; font-size: 13px;" type="submit" name="commit" value="Sign In" /> 
</form> 
</div> 
</li> 
</ul> 
</div> 
</div> 
</div> 
</div> 

和我的javascript，我結束標記之前插入在：

<!-- Placed at the end of the document so the pages load faster --> 

<script src="twitter-bootstrap-v2/docs/assets/js/jquery.js"></script> 

<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-transition.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-alert.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-modal.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-dropdown.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-scrollspy.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-tab.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-tooltip.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-popover.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-button.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-collapse.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-carousel.js"></script> 
<script src="twitter-bootstrap-v2/docs/assets/js/bootstrap-typeahead.js"></script> 
<script> 
$(function() { 
// Setup drop down menu 
$('.dropdown-toggle').dropdown(); 

// Fix input element click problem 
$('.dropdown input, .dropdown label').click(function(e) { 
e.stopPropagation(); 
}); 
});</script> 

謝謝！

編輯：我越想越覺得它越來越成爲Javscript的問題，因爲窗體和導航欄都很好，但是當我點擊下拉菜單時，它會關閉。

Answer 1

您在js中引用了錯誤的容器，.dropdown，它應該是.dropdown-menu;試試這個：

JS

$('.dropdown-menu input, .dropdown-menu label').click(function(e) { 
    e.stopPropagation(); 
}); 

快速提示：您可以通過使用bootstrap.js包腳本，而不是由一個加載它們一個儘量減少你的頁面JS調用的次數。