COWAZA

• WordPress

• 2020.05.14

Uncaught TypeError: $ is not a function のエラーを解決する

WordPressで以下のようなエラーが出る場合があります。

Uncaught TypeError: $ is not a function

これを解決します。

JSコードに以下の記述を追加する

jQuery(function($){
//もともとのコード
});

JSコード修正前

jQuery(function() {
    var pagetop = $('#page_top');   
    pagetop.hide();
    $(window).scroll(function () {
        if ($(this).scrollTop() > 100) {
            pagetop.fadeIn();
        } else {
            pagetop.fadeOut();
        }
    });
});

右下に設定しているページの上に移動するボタン。
最初は非表示ですが100pxスクロールすると表示するjavascriptです。
うまく動かない！？と思ってコンソールを開くとUncaught TypeError: $ is not a functionのエラーが出ていました。

JSコード修正後

(function($) {
jQuery(function() {
    var pagetop = $('#page_top');   
    pagetop.hide();
    $(window).scroll(function () {
        if ($(this).scrollTop() > 100) {
            pagetop.fadeIn();
        } else {
            pagetop.fadeOut();
        }
    });
});
});

元のコードをjQuery(function($){ここに元のコード });で囲みます。

これでエラーが回避される場合があります。