引導/下拉按鈕

嗨我試圖創建一個下拉按鈕使用引導。但它似乎不正確？引導/下拉按鈕

<div class="btn-group"> 
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> 
     Action 
     <span class="caret"></span> 
    </a> 
    <ul class="dropdown-menu"> 
     <li><a href="#">Foo</a></li> 
     <li><a href="#">Bar</a></li> 
    </ul> 
</div>

一個的jsfiddle這裏http://jsfiddle.net/UrgP8/

任何想法？

感謝，

來源

2012-12-21 felix001

它看起來像一個JavaScript問題：對於初學者，你包括bootstrap-dropdown.js和bootstrap.min.js你應該只需要一個，但是這並不能解決問題在小提琴... – Agush

您正在加載外部資源的大幅金額爲的jsfiddle通過粘貼什麼是幾乎完整的自舉html源代碼到HTML視圖。

這是一個更加簡單的版本，它只加載三個外部文件。

http://jsfiddle.net/BqKNV/65/

基本HTML是相同的（SO不會讓我沒有張貼投入代碼...）

<div class="dropdown btn-group"> 
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> 
     Action 
     <span class="caret"></span> 
    </a> 
    <ul class="dropdown-menu"> 
     <li><a href="#">Foo</a></li> 
     <li><a href="#">Bar</a></li> 
    </ul> 
</div>

注意，jQuery是通過的jsfiddle的框架面板加載，引導

//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css
// netdn：CSS和JS經由BootstrapCDN加載a.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js

，如果你這個網站保存爲網頁，並在瀏覽器中運行它，會發生什麼？

<!DOCTYPE html> 
    <html> 
    <head> 
     <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
     <title> - jsFiddle demo</title> 
     <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script> 
     <script type='text/javascript' src="http://twitter.github.com/bootstrap/assets/js/bootstrap.min.js"></script> 
     <link rel="stylesheet" type="text/css" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css"> 
    </head> 
    <body> 
     <div class="dropdown btn-group"> 
     <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> 
      Action 
      <span class="caret"></span> 
     </a> 
     <ul class="dropdown-menu"> 
      <li><a href="#">Foo</a></li> 
      <li><a href="#">Bar</a></li> 
     </ul> 
     </div> 
    </body> 
    </html>

來源

2012-12-22 00:40:03 mg1075

感謝您的響應。它似乎是，他們都在jsfiddle工作，但只要我直接在瀏覽器中嘗試，我得到同樣的問題？ – felix001

@ felix001 - 不太確定你的意思。我粘貼了代碼，刪除了幾個項目，這些代碼位於jsfiddle中。當你在瀏覽器中運行時會發生什麼？ – mg1075

非常感謝，它現在的工作我認爲這是我如何加載js腳本。 – felix001

好的發現什麼似乎是你的小提琴中的問題。

這是您要裝入：

<link href="http://flip.hr/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

我把它改爲：

<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />

這基本解決了。你可以在這裏看到：http://jsfiddle.net/6hPMb/1/

但除此之外，我在評論中提到的問題仍然有效，你同時裝入引導-dropdown.js和bootstrap.min.js

你應該只使用一個。

來源

2012-12-22 00:55:32 Agush

引導/下拉按鈕

回答

相關問題