jQuery Uncaught TypeError:オブジェクト[オブジェクトウィンドウ]のプロパティ '$'は関数ではありません


92

すべて、事前にバンドルされたJS / CSSフォームアプリケーションをダウンロードし、それをWordpressで使用しようとしています。私は次のコードを持っています:

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


});

Wordpressの競合が問題を引き起こしていないと想定していたため、最後のブラケットを次のように更新しました。

}, "jQuery");

ただし、まだ同じエラーが発生します。誰もがこの問題の原因となるものと、それを解決する方法を知っていますか?

前もって感謝します!

回答:


260

これは構文の問題であり、WordPressに含まれるjQueryライブラリは「競合なし」モードでロードされます。これは、WordPressがロードできる他のJavaScriptライブラリとの互換性の問題を防ぐためです。「競合なし」モードでは、$ショートカットは使用できず、より長いjQueryが使用されます。

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

関数呼び出しの後にかっこ内に$を含めると、コードブロック内でこのショートカットを使用できます。

詳細については、WordPress Codexを参照してください


最後に「jQuery」を
失う

3
あなたはそのような命の恩人です!!! 3日間のデバッグの後、これが私の問題の正確な解決策であることがわかりました。WordPressはjQueryファイルをロードしていましたが、ドキュメントに記載されている機能にアクセスできませんでした。したがって、この正確なコード行、つまり、完全にjQuery(document).ready(function ($) {修正されました。共有してくれてありがとう。
Devner、2014年

2
これはDrupalでも同じ問題です。ソリューションもそこで機能します。ありがとう
Yogesh Gupta

35

私のお気に入りの競合しないフレンドリーな構成:

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

関数ポインターでjQueryを呼び出すことは、$(document).ready(...)のショートカットです。

または私たちがコーヒースクリプトで言うように:

jQuery ($) ->
  # code here

場合は$合格する理由-すでにjQueryのインスタンスでありjQuery、それを与える$、もう一度名前を?
zerkms

2
$が別のライブラリと競合している場合、jQueryインスタンスではない可能性があります-非競合モード。
ジュリアン、

4
それはへのショートカットです$(document).ready()、ではない$(document).on('load')
ケビン・B

これは私のために働いた!私のテーマのすべてのcustom.js関数が、説明のつかないほど壊れました。私は$(document).ready(function(){をこれで置き換え、それは魔法のように機能しました:)
Ira Herman


1

次のようなものをテーマのfunctions.phpファイルに追加することで、デフォルトのWordPress jQueryスクリプトをGoogleライブラリに置き換えることを検討できます。

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

ここから取得したコード:http : //www.wpbeginner.com/wp-themes/replace-default-wordpress-jquery-script-with-google-library/


WPダウンサイド以外で「外部」JQueryプラグインを使用している場合の最善の解決策:-可能性-一部のWordpressプラグインと競合-私の側で何も気付かれない
RunsnbunsN 2014年

-1

多分あなたはjqueryの前にこのようなコードを持っています:

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

そして彼らは紛争でした

$を(jQuery)に変更できます


1
var $=jQuery.noConflict();Mineがjava-webappセットアップのように使用しましたが、同じエラーが発生しました!
encoding_idiot 2013
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.