[jQuery] WordPressでJQueryが動かない場合の対処方法

WordPressでjQueryを使おうとすると動かない場合があります。WordPressじゃないとうまく動いているプログラムでも
WordPressだと動いてくれない!そんな状況になってしまいます。原因は複数のjQueryがお互いに影響を及ぼしているということです。
WordPressに限らず、複数のjQuery関係のライブラリを同時に利用するときにも同様の現象が起こったりします。
下記のような方法で対処可能です。
Contents
WordPressに入っているjQuery
WordPressにはjQueryがパッケージされています。
headerに
1 |
<?php wp_head(); ?> |
が記入されているとjQueryへのリンクが自動で貼られます。
WordPressにパッケージされているJQueryではjQuery.noConflict();という関数が実行されていて、これが原因でJQueryが動かないということになっているのです。
対処法
WordPressのjQueryパッケージの読み込みを止めて、GoogleのjQueryを読み込むようにする。
これが一番簡単な方法ですね。
WordPressのjQueryパッケージの読み込みを止めるはヘッダー内(<header></header>)に
1 |
<?php wp_deregister_script('jquery'); ?> |
を記述します。
Googleの配信しているjQueryを読み込むにはヘッダー内に以下を追記します。
1 |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> |
これでjQueryの重複読み込みも無く、うまくjQueryが動く環境になりました。
関連記事
- [jQuery] Google Hosted Libraries を利用してjQueryを使えるようにする
- [JQuery] Datepickerで日付をカレンダー形式で簡単に入力する方法
- [jQuery] エラー: uncaught referenceerror $ is not defined の対処方法
- [JQuery] Ajaxが使える状態かどうかチェックする方法
- [Bootstrap] Modal dialog(モーダル・ダイアログ)の使い方