13

Bootstrap ドキュメントの例を試しているところですが、うまくいかないようです。プレーンな HTML を取得するだけです。これは私のコードです:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="bootstrap.css" type="text/css">
<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>

$('.dropdown-toggle').dropdown();


</script>
<title>Dropdown</title>
</head>

<ul class="nav nav-pills">
  <li class="active"><a href="#">Regular link</a></li>
  <li class="dropdown" id="menu1">
    <a class="dropdown-toggle" data-toggle="dropdown" href="#menu1">
      Dropdown
      <b class="caret"></b>
    </a>
    <ul class="dropdown-menu">
      <li><a href="#">Action</a></li>
      <li><a href="#">Another action</a></li>
      <li><a href="#">Something else here</a></li>
      <li class="divider"></li>
      <li><a href="#">Separated link</a></li>
    </ul>
  </li>
  ...
</ul>

</body>
</html>

誰かが問題を見ていますか?ありがとう。

4

4 に答える 4

19

あなたのマークアップには 2 つの問題があります。

まず、jquery プラグインの「前」にブートストラップ プラグインを含めます。Jquery が最初で、bootstrap プラグインが 2 番目です。

次に、ブートストラップでサポートされていない DOCTYPE を使用しているため、HTML5 の DOCTYPE を使用する必要があります。

<!DOCTYPE html>
于 2012-05-26T13:10:03.083 に答える
-1

<body>開始タグが表示されません

于 2014-02-24T22:30:26.050 に答える
-3

動作デモ http://jsfiddle.net/jyy96/2/ または http://jsfiddle.net/jyy96/2/showまたはhttp://jsfiddle.net/jyy96/

編集2015 年 7 月 9 日 -ここで修正: http://jsfiddle.net/jyy96/792/またはhttp://jsfiddle.net/jyy96/792/show/

==========================================

bootstrapcdn が一般的な選択肢のようですが、cdnjs.com を使用したい場合は、「すべてのファイル」があり、最新 (バージョン 2.0.0 から 2.1.1) に保たれています。

http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap.css
http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap.min.css
http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap-responsive.css
http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap-responsive.min.css
http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/bootstrap.js
http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/bootstrap.min.js
http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/img/glyphicons-halflings-white.png
http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/img/glyphicons-halflings.png

==========================================

この助けを願っています。

脚本

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


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

Jクエリコード

   $('.dropdown-toggle').dropdown();

[1] https://github.com/twbs/bootstrap/issues/1679

于 2012-05-26T13:08:20.473 に答える