jQuery Uncaught TypeError: Właściwość „$” obiektu [Object Window] nie jest funkcją

92

Wszystko, pobrałem wstępnie spakowaną aplikację formularza JS / CSS i próbuję użyć jej w Wordpress. Mam następujący kod:

$(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;
};


});

Zakładałem, że Wordpress nie powoduje konfliktu, więc zaktualizowałem ostatni nawias, aby wyglądał następująco:

}, "jQuery");

Jednak nadal otrzymuję ten sam błąd. Czy ktoś wie, co byłoby przyczyną tego problemu i jak go rozwiązać?

Z góry dziękuję!

user1048676
źródło

Odpowiedzi:

260

Jest to problem ze składnią, biblioteka jQuery dołączona do WordPressa ładuje się w trybie „bez konfliktu”. Ma to zapobiec problemom ze zgodnością z innymi bibliotekami javascript, które może załadować WordPress. W trybie „no-confict” skrót $ nie jest dostępny i im dłużej używane jest jQuery, tj.

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

Umieszczając $ w nawiasach po wywołaniu funkcji, możesz następnie użyć tego skrótu w bloku kodu.

Aby uzyskać szczegółowe informacje, zobacz WordPress Codex

RedEyedMonster
źródło
Dodam, że na końcu
trzeba zgubić
3
Jesteś takim OSZCZĘDNOŚCIĄ ŻYCIA !!! Po 3 dniach debugowania stwierdziłem, że jest to dokładne rozwiązanie mojego problemu. Chociaż WordPress ładował plik jQuery, nie mogłem uzyskać dostępu do funkcji wymienionych w gotowym dokumencie. Więc ta dokładna linia kodu, czyli jQuery(document).ready(function ($) {naprawiona na dobre. Wielkie dzięki za udostępnienie.
Devner
2
to jest ten sam problem w Drupalu. Tam też działa rozwiązanie. Dziękuję
Yogesh Gupta
35

Moja ulubiona konstrukcja bez konfliktów:

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

Wywołanie jQuery ze wskaźnikiem do funkcji jest skrótem do $ (document) .ready (...)

Lub, jak mówimy w skrypcie kawowym:

jQuery ($) ->
  # code here
juliański
źródło
Jeśli $jest już instancją jquery - czy jest jakiś powód, aby ją przekazać jQueryi ponownie nadać jej $nazwę?
zerkmy
2
$ może nie być instancją jQuery, jeśli jest w konflikcie z inną biblioteką - tryb bez konfliktu.
Julian
4
To jest skrót do $(document).ready(), a nie$(document).on('load')
Kevin B
To zadziałało dla mnie! Wszystkie funkcje custom.js w moim motywie zepsuły się w niewytłumaczalny sposób. Zastąpiłem $ (document) .ready (function () {tym i zadziałało jak magia :)
Ira Herman
6

W Wordpressie wystarczy wymienić

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

z

jQuery(function(){...});
Shashank Agarwal
źródło
1

Możesz rozważyć zastąpienie domyślnego skryptu jQuery WordPressa biblioteką Google, dodając coś podobnego do poniższego do pliku theme functions.php:

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

Kod pobrany stąd: http://www.wpbeginner.com/wp-themes/replace-default-wordpress-jquery-script-with-google-library/

p.voinov
źródło
Najlepsze rozwiązanie, jeśli używasz "zewnętrznych" wtyczek JQuery poza WP Wada: - Może - konflikt z niektórymi wtyczkami Wordpress - nic nie zauważono po mojej stronie
RunsnbunsN
-1

może masz taki kod przed jquery:

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

a oni byli Konfliktem

możesz zmienić $ na (jQuery)

S-kias
źródło
1
Użyłem go tak, jakby var $=jQuery.noConflict();mój był konfiguracją aplikacji java-webapp, ale mam ten sam błąd!
coding_idiot