ネットの情報や、参考書を読んで$マークの付いたjavascriptの関数をwordpressに組み込んだ際に正常に動作しない場合があります。理由としては、wordpressの他の関数と衝突(コンフリクト)が起きている可能性があります。
これを防ぐために、javascriptの処理を組み込む際は、カプセル化を実施する必要があります。以下に例を挙げます。
- ウィンドウ読み込み時に動作する処理(load処理)を組み込む場合は、「jQuery(function($) {});」で囲みます。
- 即時関数を呼び出すときは以下の通り変更します。
【2017/11/29追記】
wordpressでjavascript、jQueryを利用する際に
- 「wordpress独自のjQueryを利用する方法」
- 「外部jQueryを読み込む方法」
の２種類の方法があります。それぞれメリット、デメリットがありますが、1を選択した場合は、ネットやフリーで提供されている＄付きのjavascriptソースコードをカプセル化しないといけないことが多いので、そこはデメリットになります。
制作するホームページによって、どちらを使うかを選択しなければなりませんが、機会があれば両方試してみた方が勉強になるかと思います。
【2015/03/29追記】
基本的に「jQuery(function($) {});」はjsファイルの全体を囲むことで、手間が省けます。ただし、ユーザで定義する関数を外部htmlから呼び出す場合は、「jQuery(function($) {」で囲まれるため、スコープの範囲外となってしまいます。(デバッグで見ると、関数名 is not defined となる）
この場合は、グローバル変数にユーザが定義した関数をセットすることで、外部から呼び出し可能です。
ex,
jQuery(function($) {
window.test = test; //外部のhtmlから呼び出す場合は関数をグローバル変数に設定する
function test() {
alert("testメッセージ");
}
});
