TypeError: $ is not a function エラー:WordPress サイトでは Firebug のコンソールで $ 使った jQuery のコードが動かなかった:解決

問題

Firefox の Firebug のコンソールで、WordPress で作られたサイトの JavaScript を検証をするために jQuery の $ を使おうとしたら、「TypeError: $ is not a function」が表示されてしまいました。

「$」が定義されていないと言う事ですが、jQuery は読み込まれています。

原因

実は、WordPress では jQuery と、プラグインなどが独自に読み込んだ JavaScript がコンフリクトしないように「$の別名定義」が行われています。

つまり、「$」ではなく「jQuery」が使われています。

解決方法

早い話が「$」の代わりに「jQuery」を使えば OK です。

HTML はこれ

[code lang=’html’]
[/code]

Firebug のコンソールでの動き

WordPress上のjQuery

この例では、id に email を指定した input タグの値が、確かに「jQuery(‘#email’).val()」で取得できていることがわかります。

まとめ

Firefox 上で JavaScript のデバッグに Firebug を使っている方は多いと思うのですが、$ が使えない理由が WordPress と言うところで引っかかる方も多いのかと思います(自分もでしたが・・)。

わかれば簡単な事なんですけどね。

え?Webサイトのバックアップ、してないの!?

いざという時には復旧までしてくれる
『ワードプレス外部バックアップサービス』

■3つの特長
・自分でやらなくて良い
・いざという時の復旧付き
・外部サーバーにバックアップ

コメントを残す