web-dev-qa-db-ja.com

不明なエラー:BootstrapのJavaScriptにはjQueryが必要です

まず、私の問題を見てくれてありがとう! Seccond、私のような他の質問を見ました(例: ncaught Error:BootstrapのJavaScriptにはrequirejsでjQueryが必要です )が、彼らは私の質問を隠しませんでした。

だから、ここに私の_<head>_の_<html>_があります

_<!DOCTYPE html>
_
_    <!-- metadata -->
    <meta charset="UTF-8">

        <!-- responsive -->
            <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- [/] responsive -->

    <!-- [/] metadata -->




    <!-- links -->

        <!-- bootstrap -->

        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

        <!-- Optional theme -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

        <!-- [/] bootstrap -->

    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/style.css">
    <!-- [/] links -->




    <!-- script -->
    <!--<script src="js/action.js"></script>-->

        <!-- jquery -->
        <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
        <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
        <!-- [/] jquery -->

        <!-- bootstrap -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
        <!-- [/] bootstrap -->

    <!-- [/] script -->




    <title>standaard html</title>

</head>




<body>

    <!-- hoofdnavigatie -->
    <nav class="navbar navbar-default navbar-fixed-top      bas_hoofdnav">

        <!-- logo in menubalk -->
        <a class="navbar-brand" href="#">

            <img src="afb/logo/logo.png" class="bas_hoofdnav_logo" alt="Brand" >

        </a>
        <!-- [/] logo in menubalk -->




        <ul class="nav nav-pills navbar-right       bas_hoofdnav_knoppen">

            <li role="presentation" class="active       bas_hoofdnav_knp_actief"><a href="#" onclick="return false;">start</a></li>
            <li role="presentation"><a href="#">over ons</a></li>
            <li role="presentation"><a href="#">diensten</a></li>
            <li role="presentation"><a href="#">winkel</a></li>
            <li role="presentation"><a href="#">contact</a></li>

        </ul>

    </nav>
    <!-- [/] hoofdnavigatie -->

</body>
_

ご覧のとおり、jqueryとbootstrapリンクを含めました。しかし、それでも...このエラーメッセージが表示されます:Uncaught Error: Bootstrap's JavaScript requires jQuery (anonymous function) @ bootstrap.min.js:6

そしてここではエラー

ここで何かが恋しいですか?

8
OrangeCode

あなたのコードでわかるように、Bootstrap js。の後にjquery Jsを追加しました。bootstrap js。 、bootstrapはJqueryファイルが必要です。

<!-- First include jquery js -->
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

<!-- Then include bootstrap js -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
18
Deepak Arora

JQueryをBootstrap JSの上に置く必要があります。

    <!-- jquery -->
    <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
    <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
    <!-- [/] jquery -->

    <!-- bootstrap -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
    <!-- [/] bootstrap -->

確認したら、次のコマンドを使用してjqueryライブラリとbootstrapを含めます。

まず、次のようにnpmを使用してjQueryをインストールします。npm install jquery — save
次に、Bootstrap npmを次のように使用してインストールします:npm install --save bootstrap@3

私の問題は:

angular.jsonは、projectの下に含まれるスクリプトファイルのソートを変更するだけです。

     "scripts": [
          "node_modules/jquery/dist/jquery.js"
          "node_modules/bootstrap/dist/js/bootstrap.js",
        ]

このようになるには:

     "scripts": [
          "node_modules/bootstrap/dist/js/bootstrap.js",
           "node_modules/jquery/dist/jquery.js"
        ]
0
Abd Abughazaleh