TypeError: $ ist keine Funktion beim Aufrufen der jQuery-Funktion

Ich habe ein einfaches jQuery-Skript in einem WordPress-Plugin, das einen jQuery-Wrapper wie diesen verwendet:

$(document).ready(function(){

    // jQuery code is in here

});

Ich rufe dieses Skript aus dem WordPress-Dashboard auf und lade es, nachdem das jQuery-Framework geladen wurde.

Wenn ich die Seite in Firebug überprüfe, erhalte ich ständig die Fehlermeldung:

TypeError: $ ist keine Funktion

$ (Dokument) .ready (Funktion () {

Sollte ich das Skript vielleicht in diese Funktion einbinden:

(function($){

    // jQuery code is in here

})(jQuery);

Ich habe diesen Fehler einige Male gehabt und bin mir nicht sicher, wie ich damit umgehen soll.

Jede Hilfe wäre sehr dankbar.

Wenn Sie jQuery in Wordpress in die Warteschlange stellen, müssen Sie dies standardmäßig verwenden jQueryund es $wird nicht verwendet (dies dient der Kompatibilität mit anderen Bibliotheken).

Ihre Lösung zum Einwickeln functionfunktioniert einwandfrei, oder Sie können jQuery auf andere Weise laden (aber das ist in Wordpress wahrscheinlich keine gute Idee).

Wenn Sie verwenden müssen document.ready, können Sie tatsächlich $in den Funktionsaufruf übergehen :

jQuery(function ($) { ...

Dies sollte das Problem beheben:

jQuery(document).ready(function($){
  //you can now use $ as your jQuery object.
  var body = $( 'body' );
});

Einfach ausgedrückt, WordPress führt seine eigenen Skripte aus, bevor Sie können, und sie geben die $Variable frei, damit sie nicht mit anderen Bibliotheken kollidiert. Dies ist absolut sinnvoll, da WordPress für alle Arten von Websites, Apps und natürlich Blogs verwendet wird.

Aus ihrer Dokumentation:

Die in WordPress enthaltene jQuery-Bibliothek ist auf den Modus noConflict () eingestellt (siehe wp-include / js / jquery / jquery.js). Dies soll Kompatibilitätsprobleme mit anderen JavaScript-Bibliotheken verhindern, die WordPress verknüpfen kann.

Im Modus noConflict () ist die globale Verknüpfung $ für jQuery nicht verfügbar ...

Diese Lösung hat bei mir funktioniert

;(function($){
    // your code
})(jQuery);

Verschieben Sie Ihren Code in den Verschluss und verwenden Sie $stattdessenjQuery

Ich habe die obige Lösung in /magento/33348/uncaught-typeerror-undefined-is-not-a-function-when-using-a-jquery-plugin-in-ma gefunden

... nachdem ich zu viel gesucht habe

Sie können Konflikte wie diese vermeiden

var jq=jQuery.noConflict();
jq(document).ready(function(){  
  alert("Hi this will not conflict now");
  jq('selector').show();
});

var $=jQuery.noConflict();

$(document).ready(function(){
    // jQuery code is in here
});

Dank an Ashwani Panwar und Cyssoo: https://stackoverflow.com/a/29341144/3010027

Versuche dies:

<script language="JavaScript" type="text/javascript" src="jquery/jquery.js"></script>
<script>
    jQuery.noConflict();
    (function ($) {
        function readyFn() {
            // Set your code here!!
        }

        $(document).ready(readyFn); 
    })(jQuery);

</script>

Sie müssen $ in function () übergeben

<script>
jQuery(document).ready(function($){

// jQuery code is in here

});
</script>

Ersetzen Sie das $Zeichen jQuery wie folgt:

jQuery(function(){
//your code here
});

Überprüfen Sie Ihre jQuery-Referenzen. Es ist möglich, dass Sie entweder mehrmals darauf verweisen oder Ihre Funktion zu früh aufrufen (bevor jQuery definiert wird). Sie können versuchen, wie in meinen Kommentaren erwähnt, eine beliebige jQuery-Referenz oben in Ihre Datei (im Kopf) einfügen und prüfen, ob dies hilfreich ist.

Wenn Sie die Kapselung von jQuery verwenden, sollte dies in diesem Fall nicht helfen. Bitte versuchen Sie es, weil ich denke, dass es hübscher und offensichtlicher ist, aber wenn jQuery nicht definiert ist, werden Sie die gleichen Fehler erhalten.

Am Ende ... ist jQuery derzeit nicht definiert.

Außerdem finde ich die gute Lösung für den jQuery noConflict-Modus.

(function($){

  $(document).ready(function(){
      // write code here
  });

  // or also you can write jquery code like this

  jQuery(document).ready(function(){
      // write code here
  });

})(jQuery);

Ich habe diese Lösung von hier aus gefunden. https://thecodingstuff.com/how-to-properly-use-jquery-noconflict-mode-in-wordpress/

Verwenden

jQuery(document).

anstatt

$(document).

oder

Innerhalb der Funktion zeigt $ wie erwartet auf jQuery

(function ($) {
   $(document).
}(jQuery));

Was hat bei mir funktioniert? Die erste Bibliothek, die importiert wird, ist die Abfragebibliothek. Rufen Sie anschließend die Methode jQuery.noConflict () auf.

<head>
 <script type="text/javascript" src="jquery.min.js"/>
 <script>
  var jq = jQuery.noConflict();
  jq(document).ready(function(){
  //.... your code here
    });
 </script>

(Funktion ($) {
  "benutze streng";

  $ (function () {

    // Dein Code hier

  });

} (jQuery));

<script>
var jq=jQuery.noConflict();
(function ($) 
    {
    function nameoffunction()
    {
        // Set your code here!!
    }

    $(document).ready(readyFn); 
    })(jQuery);

Verwenden Sie jetzt jq anstelle von jQuery

Dieses Problem tritt auf, wenn Ihr Funktionsname und einer der ID-Namen in der Datei identisch sind. Stellen Sie einfach sicher, dass alle Ihre ID-Namen in der Datei eindeutig sind.

Sie können verwenden

jQuery(document).read(function(){ ... });

oder

(function ($) { ... }(jQuery));