WordPressで自作jQueryがうまく動かない場合の対処法

2015-01-13 WordPress

WordPressで自作のjQueryがうまく動かない場合の対処法をメモ

WordPressではプラグインを使用したりすると
Wordpress内部のjQueryが「wp_head()」に読み込まれてしまい、
その影響で自作のjQueryが動かなくなってしまうことがあります。

その回避方法として、
１．wp_enqueue_script(‘jquery’);を使う

まず、一つの方法としてはWordpress内部のjQueryを読み込ませない方法です。
これはwp_head()の記述より前かfunctions.phpに

<?php wp_deregister_script('jquery'); ?>

でＯＫ
これでWordpress内部のjQueryファイルは読み込まれなくなるので、
あとはサーバーにアップしたjQuery.jsファイルかgoogleAPIからjQueryファイルを読み込めばＯＫ

2.スクリプトの実行

WordPressでスクリプトを実行する際はいくつかやり方があるのでメモ

１．$を使えるようにする方法

<script type="text/javascript">
jQuery(document).ready(function($){
//ここに記述
});
</script>

のように囲えばOK

２．$を『jQuery』に置き換える方法

<script type="text/javascript">
jQuery(document).ready(function () {
    jQuery("#sample").hide();
});
</script>

３．noConflictに値を入れ、『jQuery』以外に置き換える方法

<script type="text/javascript">
var j = jQuery.noConflict();
j(document).ready(function () {
    j("#sample").hide();
});
</script>

bookfan 1号店楽天市場店

¥3,300 （2024/04/25 18:48時点 | 楽天市場調べ）

ポチップ

楽天Kobo電子書籍ストア

¥3,278 （2024/04/19 19:05時点 | 楽天市場調べ）

ポチップ

WordPressで自作jQueryがうまく動かない場合の対処法 | コーディング・プログラミング・WEB制作ブログ