$ WordPressでjQueryを使用して定義されていません


32

$「jQuery」を切り替えることができ、すべてが期待どおりに動作するため、jQueryがロードされていることを知っていますが、これを修正できない場合、これは厄介なスクリプトになります

このスクリプト:

jQuery(document).ready(function(){
    $("ul.vimeo_desc_feed li a").click(function(){
        alert($(this).attr('href'));
        return false;
    })
});

エラーを生成します $ is not a function

このスクリプト:

jQuery(document).ready(function(){
    jQuery("ul.vimeo_desc_feed li a").click(function(){
        alert(jQuery(this).attr('href'));
        return false;
    })
});

正常に動作します。

回答:


42

JavaScriptを自己呼び出し関数内にラップし、ローカル変数名としてjQuery使用して、引数として渡すことができます$。例えば:

(function($) {
  $(document).ready(function(){
    $("ul.vimeo_desc_feed li a").click(function(){
      alert($(this).attr('href'));
      return false;
    })
 });
}(jQuery));

意図したとおりに動作するはずです。

WPが提供するjQueryのバージョン(覚えている場合)を正しく覚えていれば、wp_enqueue_script('jquery')jQueryはすぐに競合せ$ず、未定義になります。


ああ、なるほど。以前は手動で追加していたので、なぜこの問題に遭遇しなかったのかを説明しています。
マイルドファズ

ありがとう、私は終了の代わりにjQueryで最初の代替形式を使用していましたが、値を返す方法がわかりませんでした。この形式では、自己呼び出し関数の前に戻りを追加しただけで、動作します。
eselk

非常に便利な答え。
-MarkSkayff

32

あなたはほとんどそこにいます!

jQuery(document).ready(function($){
    $("ul.vimeo_desc_feed li a").click(function(){
        alert($(this).attr('href'));
        return false;
    })

});

$メソッドとしてjQueryへの参照を関数として渡す必要があります。そうしないと機能しません。function()上記のように、最初の呼び出し内に$を配置するだけであれば、問題なく動作します。


4
+1:jQuery最後に置くよりも読みやすい。
fuxia

1
...しかし、それは匿名関数を実行する標準的な方法ではありません。 forum.jquery.com/topic/jquery-anonymous-function-calls
BryanH

5
はいといいえ。どちらも「標準的な」方法と見なされています。$ローカルで定義されたシングルトンクラスを作成します。もう1つは、ドキュメントのreadyイベントのハンドラーを定義し、jQueryオブジェクトをとしてハンドラーに渡します$readyイベントにフックしようとする場合、2番目の方法がより広く使用されます。jQueryが他の目的で($.browserたとえば、フックするために)必要な場合は、シングルトンクラスを使用します。
EAMann

+1 for jQuery(document).ready(function($){... jqueryとWordPressに関する詳細情報は、私の投稿で読むこともできます:wpengineer.com/2028/small-tips-using-wordpress-and-jquery
bueltge

6

関数をjQueryに渡すのは簡単です。コールバックの最初のパラメーターとして$(document).ready(...)配置することにより$、そのコールバック内にjQueryのエイリアスを作成します。

jQuery(function($) {
    $("ul.vimeo_desc_feed li a").click(function(){
        alert($(this).attr('href'));
        return false;
    });
});

こちらのドキュメントをご覧ください。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.