TypeError: $ no es una función cuando se llama a la función jQuery

Tengo un script jQuery simple en un plugin de WordPress que está usando un contenedor jQuery como este:

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

Estoy llamando a este script desde el WordPress Dashboard y lo estoy cargando DESPUÉS de que se haya cargado el framework jQuery.

Cuando reviso la página en Firebug, sigo recibiendo constantemente el mensaje de error:

TypeError: $ no es una función

$ (document) .ready (function () {

¿Debería quizás envolver el script en esta función?

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

He tenido este error varias veces y no estoy seguro de cómo manejarlo.

Cualquier ayuda sería muy apreciada.

    De forma predeterminada, cuando pone en cola jQuery en WordPress, debe usar jQuery y $ no se usa (esto es por compatibilidad con otras bibliotecas).

    Su solución de envoltura en function funcionará bien, o puede cargar jQuery de otra manera (pero probablemente no sea una buena idea en WordPress).

    Si debe usar document.ready , puede pasar $ en la llamada a la función:

     jQuery(function ($) { ... 

    Esto debería solucionarlo:

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

    En pocas palabras, WordPress ejecuta sus propios scripts antes de que pueda y liberan $ var para que no colisionen con otras bibliotecas. Esto tiene mucho sentido, ya que WordPress se usa para todo tipo de sitios web, aplicaciones y, por supuesto, blogs.

    De su documentación:

    La biblioteca jQuery incluida con WordPress está configurada en el modo noConflict () (consulte wp-includes / js / jquery / jquery.js). Esto es para evitar problemas de compatibilidad con otras bibliotecas de JavaScript que WordPress puede vincular.

    En el modo noConflict (), el atajo $ global para jQuery no está disponible …

    Esta solución funcionó para mí

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

    Mueva su código dentro del cierre y use $ lugar de jQuery

    Encontré la solución anterior en https://magento.stackexchange.com/questions/33348/uncaught-typeerror-undefined-is-not-a-function-when-using-a-jquery-plugin-in-ma

    … después de buscar demasiado

    Puedes evitar conflictos como este

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

    Prueba esto:

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

    Crédito a Ashwani Panwar y Cyssoo respuesta: https://stackoverflow.com/a/29341144/3010027

    Tienes que pasar $ en la función ()

      

    Verifica tus referencias jQuery. Es posible que esté haciendo referencia a él más de una vez o llame a su función demasiado pronto (antes de que se defina jQuery). Puede intentarlo como se menciona en mis comentarios y poner cualquier referencia jQuery en la parte superior de su archivo (en la cabeza) y ver si eso ayuda.

    Si usa la encapsulación de jQuery, no debería ayudar en este caso. Pruébalo porque creo que es más bonito y más obvio, pero si jQuery no está definido, obtendrás los mismos errores.

    Al final … jQuery no está definido actualmente.

    Lo que funcionó para mí La primera biblioteca que importar es la biblioteca de consultas y luego llamar al método jQuery.noConflict ().

        
      (función ($) {
       "usar estricto";
    
       $ (función () {
    
         // Tu código aquí
    
       });
    
     } (jQuery));
    
      

    ahora usa jq en lugar de jQuery

    Te encuentras con este problema cuando el nombre de tu función y uno de los nombres de identificación en el archivo son los mismos. solo asegúrese de que todos sus nombres de identificación en el archivo sean únicos.

    Utilizar

     jQuery(document). 

    en lugar de

     $(document). 

    o

    Dentro de la función, $ apunta a jQuery como es de esperar

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

    Además, encuentro la buena solución para usar el modo jQuery noConflict.

     (function($){ $(document).ready(function(){ // write code here }); // or also you can write jquery code like this jQuery(document).ready(function(){ // write code here }); })(jQuery); 

    Encontré esta solución desde aquí. https://thecodingstuff.com/how-to-properly-use-jquery-noconflict-mode-in-wordpress/

    reemplace $ sign con jQuery esta manera:

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