[解決済み] ブートストラップ・モーダル：関数ではありません

質問

私のページにモーダルがあります。ウィンドウのロード時にそれを呼び出そうとすると、コンソールに次のようなエラーが表示されます。

$(...).modal is not a function

これは私のモーダルHTMLです。

<div class="modal fade" id="prizePopup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                &times;
            </button>
            <h4 class="modal-title" id="myModalLabel">
                This Modal title
            </h4>
        </div>
        <div class="modal-body">
            Add some text here
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">
                Submit changes
            </button>
        </div>
    </div>
</div>

<script type="text/javascript" src="js/bootstrap.js"></script>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

そして、これはウィンドウがロードされたときにそれを実行するためのJavaScriptです。

<script type="text/javascript">
$(window).load(function() {
    $('#prizePopup').modal('show');
});
</script>

どうすればこの問題を解決できますか？

どのように解決するのですか？

スクリプトの順番に問題があります。この順番で読み込んでください。

<!-- jQuery -->
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<!-- BS JavaScript -->
<script type="text/javascript" src="js/bootstrap.js"></script>
<!-- Have fun using Bootstrap JS -->
<script type="text/javascript">
$(window).load(function() {
    $('#prizePopup').modal('show');
});
</script>

なぜこのようなことをするのか？なぜなら Bootstrap JSはjQueryに依存しています。 :

プラグインの依存性

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