Bootstrap JS和Navbar Button

我通常在rails上使用Ruby來開發我的作品，其中使用了崇高的文本作爲我的文本編輯器，但是今天我只使用記事本和本地創建網站。現在通常我所有的js和css都通過rails中的資源管道完美呈現，但我無法讓js工作，特別是導航欄中的下拉按鈕。Bootstrap JS和Navbar Button

我是頭

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>

內調用jQuery和我打電話我bootstrap.js文件

<script src="js/bootstrap.js" type="text/javascript"></script>

的CSS的導航欄是如下

<div class="container"> 
    <div class="navbar"> 
    <div class="navbar-inner"> 
    <div class="container"> 

    <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> 


    <!-- Everything you want hidden at 940px or less, place within here --> 
    <div class="nav-collapse"> 
    <ul class="nav"> 
    <li><a href="#">Home</a></li> 
    <li><a href="#">About Us</a></li> 
    <li><a href="#">Menu</a></li> 
    <li><a href="#">Contact Us</a></li> 
</ul> 
    </div> 

</div>

我是否因爲按鈕沒有響應而錯失了一些明顯的東西？

任何幫助讚賞

來源

2012-08-22 Richlewis

Ruby on rails是一個文本編輯器嗎？！ – tkone

編輯問題@tkone，建設性的答案將是偉大的！ – Richlewis

那麼......看你的問題仍然沒有意義，所以很難有建設性。您顯示的代碼是HTML，而不是CSS。代碼中沒有「按鈕」，而是一個具有CSS類的鏈接，這使得它看起來像一個按鈕。您是否嘗試過在瀏覽器中使用調試器，以確保在點擊鏈接時調用鏈接的onclick方法？ – tkone

CDN沒有拉動jquery，所以我現在在本地託管文件，它工作正常

來源

2012-08-29 11:11:55 Richlewis

您是否包含了所需的bootstrap.css樣式表？

<link href="css/bootstrap.min.css" rel="stylesheet">

編輯1：

這裏有一個jsBin與HTML /引導。如果你看不到相同的輸出，那麼確實是錯誤的。如果您希望某個導航欄按鈕被點擊時出現某種行爲，那麼它實際上並不是一個錯誤：沒有js行爲附加到導航欄的點擊。

Bootstrap將爲您提供一個「美化」的導航欄，它會改變美學，但不會改變行爲，您仍然需要連接到單個點擊併爲他們定義自己的行爲。

編輯2：

要連接到你必須讓你的菜單項和使用jQuery來定義的onclick行爲的點擊次數。一個例子是確定唯一的ID爲每個導航欄項目

<li><a id="home" href="#">Home</a></li> 
<li><a id="about" href="#">About Us</a></li>

然後用jQuery的選擇進行檢索和附加單擊處理程序：

$("#home").click(function() { 
    alert('home clicked'); 
}); 

$("#about").click(function() { 
    alert('about clicked'); 
});

我編輯的jsbin添加這個例子。

來源

2012-08-22 12:37:53 xqwzts

是的，這就是所有 – Richlewis

是肯定表現不同，當我點擊我的按鈕什麼也沒有發生 – Richlewis

你能提供一個jsBin例子或編輯你的問題，包括你用來處理點擊的JavaScript？ – xqwzts

Bootstrap JS和Navbar Button

回答

相關問題