jQuery Uncaught TypeError: Propriedade '$' do objeto [Object Window] não é uma função

92

Tudo, eu baixei um aplicativo de formulário JS / CSS pré-agrupado e estou tentando usá-lo no Wordpress. Eu tenho o seguinte código:

$(document).ready(function () {


/*----------------------------------------------------------------------*/
/* Parse the data from an data-attribute of DOM Elements
/*----------------------------------------------------------------------*/


$.parseData = function (data, returnArray) {
    if (/^\[(.*)\]$/.test(data)) { //array
        data = data.substr(1, data.length - 2).split(',');
    }
    if (returnArray && !$.isArray(data) && data != null) {
        data = Array(data);
    }
    return data;
};

/*----------------------------------------------------------------------*/
/* Image Preloader
/* http://engineeredweb.com/blog/09/12/preloading-images-jquery-and-javascript
/*----------------------------------------------------------------------*/



// Arguments are image paths relative to the current page.
$.preload = function() {
    var cache = [],
        args_len = arguments.length;
    for (var i = args_len; i--;) {
        var cacheImage = document.createElement('img');
        cacheImage.src = arguments[i];
        cache.push(cacheImage);
    }
};


/*----------------------------------------------------------------------*/
/* fadeInSlide by revaxarts.com
/* Fades out a box and slide it up before it will get removed
/*----------------------------------------------------------------------*/


$.fn.fadeInSlide = function (speed, callback) {
    if ($.isFunction(speed)) callback = speed;
    if (!speed) speed = 200;
    if (!callback) callback = function () {};
    this.each(function () {

        var $this = $(this);
        $this.fadeTo(speed / 2, 1).slideDown(speed / 2, function () {
            callback();
        });
    });
    return this;
};


/*----------------------------------------------------------------------*/
/* fadeOutSlide by revaxarts.com
/* Fades out a box and slide it up before it will get removed
/*----------------------------------------------------------------------*/


$.fn.fadeOutSlide = function (speed, callback) {
    if ($.isFunction(speed)) callback = speed;
    if (!speed) speed = 200;
    if (!callback) callback = function () {};
    this.each(function () {

        var $this = $(this);
        $this.fadeTo(speed / 2, 0).slideUp(speed / 2, function () {
            $this.remove();
            callback();
        });
    });
    return this;
};

/*----------------------------------------------------------------------*/
/* textFadeOut by revaxarts.com
/* Fades out a box and slide it up before it will get removed
/*----------------------------------------------------------------------*/


$.fn.textFadeOut = function (text, delay, callback) {
    if (!text) return false;
    if ($.isFunction(delay)) callback = delay;
    if (!delay) delay = 2000;
    if (!callback) callback = function () {};
    this.each(function () {

        var $this = $(this);
        $this.stop().text(text).show().delay(delay).fadeOut(1000,function(){
            $this.text('').show();
            callback();
        })
    });
    return this;
};

/*----------------------------------------------------------------------*/
/* leadingZero by revaxarts.com
/* adds a leding zero if necessary
/*----------------------------------------------------------------------*/


$.leadingZero = function (value) {
    value = parseInt(value, 10);
    if(!isNaN(value)) {
        (value < 10) ? value = '0' + value : value;
    }
    return value;
};


});

Eu estava supondo que o Wordpress sem conflito estava causando um problema, então atualizei o último colchete para se parecer com o seguinte:

}, "jQuery");

No entanto, continuo recebendo o mesmo erro. Alguém sabe o que seria esse problema e como resolvê-lo?

Desde já, obrigado!

user1048676
fonte

Respostas:

260

Este é um problema de sintaxe, a biblioteca jQuery incluída no WordPress carrega no modo "sem conflito". Isso evita problemas de compatibilidade com outras bibliotecas javascript que o WordPress pode carregar. No modo "no-confict", o atalho $ não está disponível e o jQuery mais longo é usado, ou seja,

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

Incluindo o $ entre parênteses após a chamada de função, você pode usar este atalho dentro do bloco de código.

Para mais detalhes, consulte o WordPress Codex

RedEyedMonster
fonte
Devo acrescentar que você precisa perder o "jQuery" no final
RedEyedMonster
3
Você é um SALVADOR DE VIDA !!! Após 3 dias de depuração, descobri que essa era a solução exata para meu problema. Embora o WordPress estivesse carregando o arquivo jQuery, não consegui acessar as funções mencionadas no documento pronto. Portanto, esta linha exata de código, isto é, jQuery(document).ready(function ($) {consertou para sempre. Muito obrigado por compartilhar.
Devner
2
este é o mesmo problema no Drupal também. A solução também funciona lá. Obrigado
Yogesh Gupta
35

Meu constructo amigo do conflito favorito:

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

Chamar jQuery com um ponteiro de função é um atalho para $ (document) .ready (...)

Ou como dizemos em coffeescript:

jQuery ($) ->
  # code here
Julian
fonte
Se $já é uma instância do jquery - algum motivo para passar jQuerye dar o $nome mais uma vez?
zerkms de
2
$ pode não ser uma instância jQuery se estiver em conflito com outra biblioteca - modo sem conflito.
Julian
4
É um atalho para $(document).ready(), não$(document).on('load')
Kevin B
Isso funcionou para mim! Todas as funções custom.js em meu tema falharam inexplicavelmente. Substituí $ (document) .ready (function () {por isso e funcionou como mágica :)
Ira Herman
6

No Wordpress basta substituir

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

com

jQuery(function(){...});
Shashank Agarwal
fonte
1

Você pode considerar a substituição do script jQuery do WordPress padrão pela Biblioteca do Google, adicionando algo como o seguinte no arquivo functions.php do tema:

function modify_jquery() {
    if (!is_admin()) {
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', false, '1.10.2');
        wp_enqueue_script('jquery');
    }
}
add_action('init', 'modify_jquery');

Código retirado daqui: http://www.wpbeginner.com/wp-themes/replace-default-wordpress-jquery-script-with-google-library/

p.voinov
fonte
A melhor solução se você estiver usando plug-ins JQuery "externos" fora do WP Desvantagem: - Pode - entrar em conflito com alguns plug-ins Wordpress - nada notado do meu lado
RunsnbunsN
-1

talvez você tenha um código como este antes do jquery:

var $jq=jQuery.noConflict();
$jq('ul.menu').lavaLamp({
    fx: "backout", 
    speed: 700
});

e eles estavam em conflito

você pode alterar $ para (jQuery)

S-kias
fonte
1
Usei-o como se o var $=jQuery.noConflict();meu fosse uma configuração de java-webapp, mas recebi o mesmo erro!
coding_idiot