web-dev-qa-db-ja.com

TypeError：$（...）。onは関数ではありません

jQuery litebox を使用しています。 JSファイルとCSSファイルを追加した後、このエラーTypeErrorが発生しました。

$(...).on is not a function at this line in js file                                           
 "return  $('body').on('click',       
'a[rel^=lightbox], area[rel^=lightbox]', function(e) {"

ここで問題を理解するのを手伝ってくれる人はいますか？

CakePHP 1.3でこの実装を行っています。

jquerycakephp-1.3lightbox
34
user1613870

問題は、jQueryの古いバージョンを使用している場合です。 jQueryの古いバージョンには「on」ではなく「live」メソッドがあるため

56
Shivang Gupta

この通常の原因は、（） Prototype、MooTools、または$シンボルを使用する他のライブラリを使用しており、jQueryの後にそのライブラリを含めていることです。そのため、ライブラリは「勝ち取ります」（$自体を取得します）。したがって、$の戻り値はjQueryインスタンスではないため、jQueryメソッドはありません（onなど）。

これらの他のライブラリでjQueryを使用できますが、使用する場合は、エイリアス$ではなくjQueryシンボルを使用する必要があります。例：

jQuery('body').on(...);

通常、jQueryを含むscriptタグの直後、他のライブラリを含むタグの前に追加するのが最適です。

<script>jQuery.noConflict();</script>

... 必須ではありませんが、jQueryの後に他のライブラリをロードする場合（最初に他のライブラリをロードする場合）。

ただし、同じページ上で複数の全機能DOM操作ライブラリを使用することは、ページの重みだけでは理想的ではありません。したがって、Prototype/MooTools/whateverまたはjQueryだけに固執できる場合は、通常はそれが優れています。

30
T.J. Crowder

私の場合、この問題はjQueryを次のようにカプセル化することで解決されます。

(function($) {
//my jquery 
})(jQuery);
9
Oskar

古いバージョンのjQuery（<1.7）を使用している場合、「on」の代わりに「bind」を使用できます。これは、jQuery 3.0の時点で「バインド」が廃止されているため、古いバージョンを使用している場合にのみ機能します。

3
Adhish

私はオスカー（および他の多くの）の解決策を試しましたが、私にとっては最終的にのみ動作しました：

jQuery(function($){
   // Your jQuery code here, using the $
});

参照： https://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/

0
ownking

私の場合、このコードは私のエラーを解決しました：

(function (window, document, $) {
            'use strict';
             var $html = $('html');
             $('input[name="myiCheck"]').on('ifClicked', function (event) {
             alert("You clicked " + this.value);
             });
})(window, document, jQuery);

関数を$（document）.readyに入れないでください

0
Mohammad Sadegh Maleki