$ ist ein undefinierter Fehler in JQuery

StackOverflow https://stackoverflow.com/questions/9313612

  •  26-10-2019
  •  | 
  •  

Frage

Ich erhalte diesen Fehler, während ich Twitter Bootstrap verwende. Ich habe diesen Fehler nicht bekommen, wenn ich ihn in HTML verwendet habe. Ich habe es in ein WordPress -Thema konvertiert, und jetzt bekomme ich diesen Fehler.

<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$('.dropdown-toggle').dropdown()
</script>

Ich bekomme diese Fehler.

  1. "$ is undefiniert" auf Bootstrap-Dropdown.js Zeile 72.
  2. "$ (". Dropdown-Toggle "). Dropdown ist keine Funktion"

Jede Hilfe wird sehr geschätzt. Danke.

EDIT: Ich habe es versucht https://stackoverflow.com/a/9301017/759257

und enthalten die neueste JQuery Version 1.7.1 und jetzt funktioniert es !!

War es hilfreich?

Lösung

Sie laden die Skripte in der falschen Reihenfolge. Laden Sie zuerst JQuery, sonst wird es für das Bootstrap -Skript nicht verfügbar sein.

Andere Tipps

Sie setzen es nicht in die richtige Reihenfolge:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script>
<script type="text/javascript">
$('.dropdown-toggle').dropdown();
</script>

Ich gehe davon aus, dass die Datei "Bootstrap-dropdown.js" ein JQuery-Plugin ist. Wenn dies der Fall ist, müssen Sie zuerst JQuery laden. Wechseln Sie also Ihre <script> Tags herum.

Rufen Sie zuerst jQuery.min.js an, dann Ihre Bootstrap-dropdown.js

Weil Ihr Bootstrap-dropdown.js ohne jQuery ausgeführt wird

Wenn Sie JQ in WordPress verwenden, sollten Sie Ihren Code einwickeln 

jQuery(document).ready(function($) {
    // $() will work as an alias for jQuery() inside of this function
});

Weitere Lektüre

Ich hatte genau das gleiche Problem. Ich habe ursprünglich alle meine JavaScript-Dateien, einschließlich Bootstrap, in eine Mega-Bunde wie folgt geladen:

    bundles.Add(New ScriptBundle("~/bundles/jquery-etc").Include(
                "~/Scripts/jquery-{version}.js",
                "~/Scripts/jquery-ui-{version}.js",
                "~/Scripts/bootstrap.js",
                "~/Scripts/respond.js",
                [other js files here]))

Ich dachte, dass Bootstrap nach JQuery geladen wurde, also sollte es in Ordnung sein. Nö. Also stecke ich Bootstrap in ein separates Bundle wie folgt:

         bundles.Add(New ScriptBundle("~/bundles/jquery-etc").Include(
                "~/Scripts/jquery-{version}.js",
                "~/Scripts/jquery-ui-{version}.js",
                [other js files here]))


          bundles.Add(New ScriptBundle("~/bundles/bootstrap").Include(
              "~/Scripts/bootstrap.js",
              "~/Scripts/respond.js"))

Dies führte dazu, dass Bootstrap nach JQuery Eigenschaft lädte. Wahrscheinlich hätte DJBs Lösung den Job auch erledigt. Aber das hat für mich funktioniert.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top