TypeError: $ bukan fungsi saat memanggil fungsi jQuery

Saya memiliki skrip jQuery sederhana di plugin WordPress yang menggunakan pembungkus jQuery seperti ini:

$(document).ready(function(){

    // jQuery code is in here

});

Saya memanggil skrip ini dari dalam Dashboard WordPress dan saya memuatnya SETELAH kerangka kerja jQuery telah dimuat.

Ketika saya memeriksa halaman di Firebug, saya terus menerima pesan kesalahan:

TypeError: $ bukan suatu fungsi

$ (dokumen) .ready (function () {

Haruskah saya membungkus skrip dalam fungsi ini:

(function($){

    // jQuery code is in here

})(jQuery);

Saya telah mengalami kesalahan ini beberapa kali dan tidak yakin bagaimana cara menanganinya.

Bantuan apa pun akan sangat dihargai.

Secara default ketika Anda membuat jQuery di Wordpress Anda harus menggunakan jQuery, dan $tidak digunakan (ini untuk kompatibilitas dengan perpustakaan lain).

Solusi Anda membungkusnya functionakan bekerja dengan baik, atau Anda dapat memuat jQuery dengan cara lain (tapi itu mungkin bukan ide yang baik di Wordpress).

Jika Anda harus menggunakan document.ready, Anda sebenarnya dapat masuk $ke panggilan fungsi:

jQuery(function ($) { ...

Ini harus memperbaikinya:

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

Sederhananya, WordPress menjalankan skrip mereka sendiri sebelum Anda dapat dan mereka merilis $var sehingga tidak akan bertabrakan dengan perpustakaan lain. Ini masuk akal, karena WordPress digunakan untuk semua jenis situs web, aplikasi, dan tentu saja, blog.

Dari dokumentasi mereka:

Pustaka jQuery yang disertakan dengan WordPress diatur ke mode noConflict () (lihat wp-include / js / jquery / jquery.js). Ini untuk mencegah masalah kompatibilitas dengan perpustakaan JavaScript lain yang dapat ditautkan oleh WordPress.

Dalam mode noConflict (), pintasan global $ untuk jQuery tidak tersedia ...

Solusi ini bekerja untuk saya

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

Pindahkan kode Anda di dalam penutupan dan gunakan $sebagai gantijQuery

Saya menemukan solusi di atas di /magento/33348/uncaught-typeerror-undefined-is-not-not-a-function-when-using-a-jquery-plugin-in-ma

... setelah mencari terlalu banyak

Anda dapat menghindari konflik seperti ini

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
});

Penghargaan untuk Ashwani Panwar dan Cyssoo: https://stackoverflow.com/a/29341144/3010027

Coba ini:

<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>

Anda harus melewati fungsi $ in ()

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

// jQuery code is in here

});
</script>

ganti $tanda dengan jQuery seperti ini:

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

Periksa referensi jQuery Anda. Mungkin saja Anda merujuknya lebih dari satu kali atau Anda memanggil fungsi terlalu dini (sebelum jQuery didefinisikan). Anda dapat mencoba seperti yang disebutkan dalam komentar saya dan meletakkan referensi jQuery di bagian atas file Anda (di kepala) dan melihat apakah itu membantu.

Jika Anda menggunakan enkapsulasi jQuery, itu seharusnya tidak membantu dalam kasus ini. Silakan coba karena saya pikir ini lebih cantik dan lebih jelas, tetapi jika jQuery tidak didefinisikan Anda akan mendapatkan kesalahan yang sama.

Pada akhirnya ... jQuery saat ini tidak didefinisikan.

Juga, saya menemukan solusi yang baik untuk menggunakan mode noConflict jQuery.

(function($){

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

  // or also you can write jquery code like this

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

})(jQuery);

Saya menemukan solusi ini dari sini. https://thecodingstuff.com/how-to-properly-use-jquery-noconflict-mode-in-wordpress/

Menggunakan

jQuery(document).

dari pada

$(document).

atau

Dalam fungsi tersebut, $ poin ke jQuery seperti yang Anda harapkan

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

Apa yang berhasil untuk saya. Pustaka pertama yang diimpor adalah pustaka kueri dan kemudian panggil metode jQuery.noConflict ().

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

(fungsi ($) {
  "gunakan ketat";

  $ (function () {

    // Kode Anda di sini

  });

} (jQuery));

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

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

sekarang gunakan jq sebagai ganti jQuery

Anda menemukan masalah ini ketika nama fungsi Anda dan salah satu nama id dalam file sama. pastikan semua nama id Anda di file unik.

Kamu bisa memakai

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

atau

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