TypeError: 'undefined' bukan sebuah fungsi (mengevaluasi '$ (dokumen)')

139
  1. Saya menggunakan situs WordPress.
  2. Saya menyertakan skrip ini di header.

Saat skrip dimuat, saya mendapatkan kesalahan ini:

TypeError: 'undefined' bukan sebuah fungsi (mengevaluasi '$ (dokumen)')

Saya tidak tahu apa yang menyebabkannya atau apa artinya itu.

Di pembakar, saya mendapatkan ini:

$ bukan fungsi

dcolumbus
sumber
4
Pastikan Anda menyertakan perpustakaan jQuery sebelum skrip kustom Anda, dan bahwa tidak ada kesalahan pada Nettab Firebug (pastikan jQuery benar-benar dimuat).
wsanville
... ya, tentu saja jQuery sedang memuat sebelumnya. Saya cukup yakin ini masalah WordPress enque.
dcolumbus

Jawaban:

239

Wordpress menggunakan jQuery dalam mode noConflict secara default. Anda perlu merujuknya menggunakan jQuerynama variabel, bukan $, mis. Gunakan

jQuery(document);

dari pada

$(document);

Anda dapat dengan mudah menyelesaikan ini dalam fungsi yang dapat dieksekusi sendiri sehingga $merujuk ke jQuery lagi (dan menghindari polusi namespace global juga), misalnya

(function ($) {
   $(document);
}(jQuery));
El Yobo
sumber
5
Naskah tidak diperlukan; Anda bisa menelepon jQuery(document)alih-alih ke $(document)mana pun Anda inginkan. Jika Anda ingin menggunakan $sebagai gantinya, maka skrip di atas hanya membuat fungsi yang mengambil argumen $lalu mengeksekusi lewatnya jQuery; singkatnya, di dalam fungsi, $menunjuk ke jQuery seperti yang Anda harapkan.
El Yobo
2
Sebenarnya, yang saya lakukan adalah menempatkan normal saya $(document).ready(function() { // code });di tempat $(document);... Anda yang bekerja seperti pesona.
dcolumbus
1
Ya, itulah yang saya sarankan - "dalam fungsi, $ poin ke jQuery seperti yang Anda harapkan".
El Yobo
Yah, itu memang menyelamatkan Anda beberapa karakter seperti itu :) Lebih detail tentang bentuk! () {} () Pernyataan self executing .
El Yobo
Saya tahu ini sudah tua @EYobo, tapi saya pikir Anda bisa mengedit posting Anda dan menambahkan contoh Anda dari komentar pertama Anda ke dalam respons sebagai contoh kedua. Terima kasih telah menghemat waktu saya =)
Manatax
25

Gunakan jQuery's noConflict. Itu membuat keajaiban bagi saya

var example=jQuery.noConflict();
example(function(){
example('div#rift_connect').click(function(){
    example('span#resultado').text("Hello, dude!");
    });
});

Artinya, anggap Anda memasukkan jQuery pada HTML Anda

<script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
Leno Britto
sumber
15

Gunakan ini:

var $ =jQuery.noConflict();
Suman Biswas
sumber
11

Coba cuplikan ini:

jQuery(function($) {
  // Your code.
})

Itu bekerja untuk saya, mungkin itu akan membantu Anda juga.

Gurpreet Dhanoa
sumber
11

Saya punya masalah ini hanya di Chrome.

Saya mencoba menambahkan

var $ =jQuery.noConflict();

sebelum menelepon

$(document).ready(function () {

Itu berhasil.

Terima kasih banyak

Le_Dhul
sumber
Terima kasih untuk yang satu ini. Saya tahu saya bisa menyelesaikan masalah menggunakan "jQuery" daripada "$" tetapi masalah saya adalah bahwa itu naik edit Komodo ketika ditulis seperti itu jadi saya harus memilih antara mendapatkan petunjuk kode / penyelesaian pada $ atau memiliki JavaScript saya benar-benar berfungsi. Metode ini biarkan saya memiliki keduanya.
George Kendros
6

Juga periksa untuk memasukkan jQuery, diikuti oleh beberapa komponen / perpustakaan lain (seperti jQuery UI) dan kemudian secara tidak sengaja memasukkan jQuery lagi - ini akan mendefinisikan ulang jQuery dan menjatuhkan komponen pembantu (seperti .depeper) dari contoh.

marah
sumber
4
 ;(function($){
        // your code
    })(jQuery);

Tempatkan kode js Anda di dalam penutupan di atas, itu harus menyelesaikan masalah.

Bikram Shrestha
sumber
4

Saya akan menggunakan ini

(function ($) {
   $(document);
}(jQuery));
Mencatat
sumber
2

Saya juga sering menghadapi masalah seperti itu di web develoment carrier. Sebenarnya ini bukan konflik JS, Ketika kita memuat situs web html ke browser kita tidak menghadapi kesalahan seperti itu, tetapi ketika kita memuat situs web jenis ini melalui localhost kita menghadapi masalah seperti itu. Itu karena localhost. Ketika kami memuat skrip melalui localhost, ia memindai skrip dan menampilkan hasilnya. Tetapi ketika kami tidak menggunakan localhost. Itu hanya memindai output. Contoh, ketika kita menulis kode php menempatkan localhost dan berjalan tanpa host kita mendapatkan kesalahan. Tetapi jika kode itu benar dan dijalankan melalui host kita mendapatkan output aktual, dan ketika kita menggunakan elemen periksa kita mendapatkan kode output dalam format HTMl tetapi tidak dalam format PHP ini karena rendering kode.

Ini adalah kesalahan render. Jadi untuk memperbaiki kesalahan kode jquery ini salah satu solusinya mungkin menggunakan metode ini.

jQuery(document).ready(function($){
/******** Body of Jquery Code*****/
});

Apa yang dilakukan kode ini adalah mendaftarkan '$' sebagai variabel ke fungsi dengan menerapkan jquery. Jika tidak, file .js hanya dibaca sebagai javascript.

Rajan Lama
sumber
1

Saya mengalami masalah ini juga ketika memasukkan jQuery di header halaman saya, tidak menyadari bahwa host sudah memasukkannya ke halaman secara otomatis. Jadi muat laman Anda langsung dan periksa sumbernya untuk melihat apakah jQuery sedang ditautkan.

FrostyL
sumber
1

Dua hal:

  1. Pastikan Anda memiliki pustaka jQuery yang ditambahkan, sebelum $ (dokumen) Anda.
  2. Kemudian cukup ganti semua "$" dengan: jQuery, seperti komentar sebelumnya.
Jorge Alejandro Inturias
sumber
1

bungkus semua skrip di antara ini ...

<script>
    $.noConflict();
    jQuery( document ).ready(function( $ ) {
      // Code that uses jQuery's $ can follow here.
    });
</script>

Banyak pustaka JavaScript menggunakan $ sebagai fungsi atau nama variabel, seperti halnya jQuery. Dalam kasus jQuery, $ hanyalah alias untuk jQuery, jadi semua fungsionalitas tersedia tanpa menggunakan $. Jika Anda perlu menggunakan pustaka JavaScript lain bersama jQuery, kembalikan kontrol $ kembali ke pustaka lain dengan panggilan ke $ .noConflict () . Referensi lama $ disimpan selama inisialisasi jQuery; noConflict () cukup mengembalikannya.

Dam Jitendra
sumber
1

Anda dapat menggunakan potongan jQuery dan $ in di bawah ini. itu berhasil untuk saya

jQuery( document ).ready(function( $ ) {
  // jQuery(document)
  // $(document)
});
Kalpesh Prajapati
sumber
1

Anda dapat melewati fungsi $ in ()

jQuery(document).ready(function($){

// jQuery code is in here

});

atau Anda bisa menggantinya $(document);dengan inijQuery(document);

atau bisa kamu gunakan jQuery.noConflict()

var jq=jQuery.noConflict();
jq(document).ready(function(){  
  jq('selector').show();
});
Ganesha
sumber