0

Django サイトで Twitter のブートストラップを適切に動作させるために、いくつかの問題が発生しています。現在、私の Twitter ブートストラップは部分的に機能しています。

たとえば、私の HTML ファイルは次のとおりです。

    <!DOCTYPE html>
    {% load staticfiles %}

    <head>

    <link rel="stylesheet" href="{% static "bootstrap/css/bootstrap.min.css" %}" type="text/css" media="screen" /> 
    <script type="text/javascript" src="{% static "bootstrap/js/bootstrap.min.js" %}" ></script>

    </head>

    <html>
    <body>

    <span class="badge badge-success" >HI!</span>
    <span class="badge">1</span>
    <span class="badge badge-warning">4</span>
    <span class="badge badge-important">6</span>
    <span class="badge badge-info">8</span>
    <span class="badge badge-inverse">10</span>

    </body>
    </html>

このコードはバッジを表示しますが、バッジの色は表示されません。それぞれにテキストが含まれる灰色のバッジのみが表示されます。コードを実行して FireBug でチェックしたところ、次のように表示されました。

    Uncaught ReferenceError: jQuery is not defined                  bootstrap.min.js:6

このプロジェクトには jQuery が欠けていると思います。

誰かが問題を解決する方法について段階的なプロセスを提供できますか? 私はウェブ開発が初めてです。すべての入力に感謝します!とても有難い!

4

3 に答える 3

1

このプロジェクトには jQuery が欠けていると思います。あなたの仮定は完全に正しいので、解決策はjQueryを含めることです(Bootstrapスクリプトを含めたのと同じように)。
CDN (コンテンツ配信ネットワーク) から特定のバージョンの jQuery を参照するか、訪問者がこのドキュメントを既にキャッシュしている可能性があり、1 つの http 要求を節約できます (サーバーと同様)。そのようなプロバイダーからスクリプトを参照することを選択した場合//code.jquery.com/jquery-latest.min.js、最新バージョンは明らかに時々変更されるため、次のようなものを使用しないことを強くお勧めします。そのため、すべてが新しいバージョンで引き続き機能することを確認する必要があります。
もちろん、特定のバージョンの jQuery をダウンロードして、Bootstrap スクリプトで行ったのと同じように含めることもできますが、後者の前に必ず含めてください。また、ページの最後にスクリプトを含めることを検討して、スクリプトを読み込んでもページの残りの読み込みがブロックされないようにすることができます。

于 2013-09-10T09:25:34.387 に答える
1

ブートストラップを適切に実行するには、 jqueryライブラリが必要です。

プラグインの依存関係

一部のプラグインおよび CSS コンポーネントは、他のプラグインに依存しています。プラグインを個別に含める場合は、ドキュメントでこれらの依存関係を確認してください。また、すべてのプラグインは jQuery に依存していることにも注意してください (つまり、プラグイン ファイルの前に jQuery を含める必要があります)。

これを入れて

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

行の前に

<script type="text/javascript" src="{% static "bootstrap/js/bootstrap.min.js" %}" ></script>

また、badge-successBootstrap 3 ではそのようなことはありません。間違ったバージョンを使用している可能性があります。

于 2013-09-10T09:15:44.733 に答える
0

JQuery は bootstrap.min.js ファイルに含まれていないため、http: //getbootstrap.com/getting-started/#templateの説明に従って追加する必要があります。

jQuery および Bootstrap js ファイルの機能を別の js ファイルで使用している場合は、jQuery および Bootstrap の後に js ファイルを含めることを忘れないでください。

ブートストラップの例に示すように、タグの前に、ページの最後に JavaScript ファイルを配置することをお勧めします。JavaScript ファイルは非常に重く、ページの読み込み時間が遅くなる可能性があるため、最後に配置します。

于 2013-09-10T09:17:37.763 に答える