jQueryプラグインの定義エラー

  • 解決済 P8

    (@mcp8v315)


    13年前

    検索結果に従い色々と試したのですが上手くいかないため投稿します.
    現在の問題は
    ･jQuery プラグイン｢jquery.vgrid.js｣が動作しない
    です.
    Wordpress のバージョンは3.3.2です.

    以下はheadタグ内の全ソースです. 説明に従い, 必要なファイルを読み込んだ後値を指定しました.

    <head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
<link rel="shortcut icon" href="<?php bloginfo('stylesheet_directory'); ?>/favicon.ico" />
<title><?php wp_title( '|', true, 'right' ); bloginfo( 'name' );
$site_description = get_bloginfo( 'description', 'display' );
if ( $site_description && ( is_home() || is_front_page() ) )
echo " | $site_description"; ?>
</title>
<?php wp_deregister_script('jquery');
wp_enqueue_script('jquery','http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js', array(), '1.7.2'); ?>
<?php if ( is_singular() && get_option( 'thread_comments' ) ) wp_enqueue_script( 'comment-reply' ); ?>
<?php wp_enqueue_script('easing',get_bloginfo('template_url') . '/js/jquery.easing.1.3.js', array('jquery')); ?>
<?php wp_enqueue_script('vgrid',get_bloginfo('template_url') . '/js/jquery.vgrid.0.1.8.js', array('jquery')); ?>
<script type="text/javascript">
//<![CDATA[
$(function(){ $("#content").vgrid({ easeing: "easeOutQuint", time: 400, delay: 20, }); });
//]]>
</script>
<?php wp_head(); ?>
</head>

    ファイルは全て正常に読み込まれていることを確認しましたが, JavaScriptコンソールで Uncaught ReferenceError: $ is not defined を吐きました.
    このエラーで検索･jQuery導入の手引きサイトをめぐり, 以下を試しましたが改善しません.

    ･ソースのカプセル化(元々カプセル化されていた)
    ･プラグインより上でjQueryを読み込む
    ･WordpressのjQueryではなくGoogleAPIのものを使用
    ･プラグインの停止

    当方非プログラマであるため, 自力で解答を導くことができませんでした.
    皆さんの知恵を貸していただけませんでしょうか.

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • podspod

    (@podspod)

    13年前

    実際に試してみたところ
    <?php wp_head(); ?>
    の後でユーザスクリプトである

    <script type="text/javascript">
//<![CDATA[
$(function(){ $("#content").vgrid({ easeing: "easeOutQuint", time: 400, delay: 20, }); });
//]]>
</script>

    を記述すべきのようです。

    以下が修正コードです。

    <head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
<link rel="shortcut icon" href="<?php bloginfo('stylesheet_directory'); ?>/favicon.ico" />
<title><?php wp_title( '|', true, 'right' ); bloginfo( 'name' );
$site_description = get_bloginfo( 'description', 'display' );
if ( $site_description && ( is_home() || is_front_page() ) )
echo " | $site_description"; ?>
</title>
<?php wp_deregister_script('jquery');
wp_enqueue_script('jquery','http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js', array(), '1.7.2'); ?>
<?php if ( is_singular() && get_option( 'thread_comments' ) ) wp_enqueue_script( 'comment-reply' ); ?>
<?php wp_enqueue_script('easing',get_bloginfo('template_url') . '/js/jquery.easing.1.3.js', array('jquery')); ?>
<?php wp_enqueue_script('vgrid',get_bloginfo('template_url') . '/js/jquery.vgrid.0.1.8.js', array('jquery')); ?>
<?php wp_head(); ?>
<script type="text/javascript">
//<![CDATA[
$(function(){ $("#content").vgrid({ easeing: "easeOutQuint", time: 400, delay: 20, }); });
//]]>
</script>
</head>
    トピック投稿者 P8

    (@mcp8v315)

    13年前

    お早いお返事ありがとうございます. 2日間悩み続けていたのはなんだったのか……初歩的な試行が足りていなかったようでお恥ずかしい限りです.

    <?php wp_head(); ?>の後にスクリプトを記述したところ, 無事動作しました.
    動かないページもありましたが, #contentの中にwidth:100%のdiv要素を入れ子にしていたためで, このdiv要素をソースコードから削除することでこちらも動作しました.

    おかげで解決いたしましたので, このスレッドを閉じさせて頂きます.
    podspodさん, ありがとうございました.

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • トピック「jQueryプラグインの定義エラー」には新たに返信することはできません。

タグ

  • フォーラム: プラグイン
  • 2件の返信
  • 2人の参加者
  • 最後の返信者: P8
  • 最後の活動: 13年前
  • 状態: 解決済