jquery - Wordpress jqueryと$記号の使い方

Question

次のようなjQueryラッパーを使用しているWordPressプラグインに単純なjQueryスクリプトがあります。

$(document).ready(function(){

    // jQuery code is in here

});

WordPress ダッシュボード内からこのスクリプトを呼び出しており、jQuery フレームワークがロードされた後にロードしています。

Firebug でページを確認すると、常にエラーメッセージが表示されます。

TypeError: $ は関数ではありません

$(document).ready(function(){

この関数でスクリプトをラップする必要があります:

(function($){

    // jQuery code is in here

})(jQuery);

私はこのエラーを何度も経験しており、それを処理する方法がわかりません。

どんな助けでも大歓迎です。

score 362 · Accepted Answer

デフォルトでは、Wordpress で jQuery をエンキューするときにを使用する必要がありjQuery、$は使用されません (これは他のライブラリとの互換性のためです)。

それをラップするソリューションはfunctionうまく機能するか、他の方法でjQueryをロードできます（ただし、Wordpressではおそらく良い考えではありません）。

を使用する必要がdocument.readyある場合は、実際に$関数呼び出しに渡すことができます。

jQuery(function ($) { ...

score 173 · Accepted Answer

これで修正されるはずです：

jQuery(document).ready(function($){
  //you can now use $ as your jQuery object.
  var body = $( 'body' );
});

簡単に言えば、WordPress はユーザーが実行する前に独自のスクリプトを実行し、$var を解放して、他のライブラリと衝突しないようにします。WordPress はあらゆる種類の Web サイト、アプリ、そしてもちろんブログで使用されているため、これは当然のことです。

ドキュメントから：

WordPress に含まれる jQuery ライブラリは noConflict() モードに設定されています (wp-includes/js/jquery/jquery.js を参照)。これは、WordPress がリンクできる他の JavaScript ライブラリとの互換性の問題を防ぐためです。

noConflict() モードでは、jQuery のグローバル $ ショートカットは使用できません...

score 33 · Accepted Answer

この解決策は私のために働いた

;(function($){
    // your code
})(jQuery);

コードをクロージャー内に移動し、$代わりに使用しますjQuery

https://magento.stackexchange.com/questions/33348/uncaught-typeerror-undefined-is-not-a-function-when-using-a-jquery-plugin-in-maで上記の解決策を見つけました

...検索しすぎた後

score 29 · Accepted Answer

var $=jQuery.noConflict();

$(document).ready(function(){
    // jQuery code is in here
});

Ashwani Panwar と Cyssoo の回答へのクレジット: https://stackoverflow.com/a/29341144/3010027

$ ではなく WordPress jQuery で使用される理由: https://pippinsplugins.com/why-loading-your-own-jquery-is-irresponsible/

score 21 · Accepted Answer

このような競合を回避できます

var jq=jQuery.noConflict();
jq(document).ready(function(){  
  alert("Hi this will not conflict now");
  jq('selector').show();
});

score 14 · Accepted Answer

これを試して：

<script language="JavaScript" type="text/javascript" src="jquery/jquery.js"></script>
<script>
    jQuery.noConflict();
    (function ($) {
        function readyFn() {
            // Set your code here!!
        }

        $(document).ready(readyFn); 
    })(jQuery);

</script>

score 9 · Accepted Answer

9

$記号をjQuery 次のように置き換えます。

jQuery(function(){
//your code here
});

于 2018-02-19T08:06:16.370 に答える

score 8 · Accepted Answer

jQuery 参照を再確認してください。複数回参照しているか、関数の呼び出しが早すぎる (jQuery が定義される前) 可能性があります。私のコメントで述べたように試してみて、jQuery 参照をファイルの先頭 (頭の中) に置いて、それが役立つかどうかを確認してください。

jQuery のカプセル化を使用する場合、この場合は役に立たないはずです。よりきれいでわかりやすいと思うので試してみてください。ただし、jQuery が定義されていないと同じエラーが発生します。

最後に... jQueryは現在定義されていません。

score 8 · Accepted Answer

使用する

jQuery(document).

それ以外の

$(document).

また

関数内では、$ は予想どおり jQuery を指します。

(function ($) {
   $(document).
}(jQuery));

score 5 · Accepted Answer

何が私のために働いた。インポートする最初のライブラリはクエリライブラリであり、次にjQuery.noConflict() メソッドを呼び出します。

<head>
 <script type="text/javascript" src="jquery.min.js"/>
 <script>
  var jq = jQuery.noConflict();
  jq(document).ready(function(){
  //.... your code here
    });
 </script>

score 4 · Accepted Answer

<script>
var jq=jQuery.noConflict();
(function ($) 
    {
    function nameoffunction()
    {
        // Set your code here!!
    }

    $(document).ready(readyFn); 
    })(jQuery);

jQuery の代わりに jq を使用するようになりました

score 4 · Accepted Answer

この問題は、関数名とファイル内の ID 名の 1 つが同じ場合に発生します。ファイル内のすべての ID 名が一意であることを確認してください。

jquery - Wordpress jqueryと$記号の使い方

17 に答える 17

Related

Reference