TypeError:$(…)。on不是一个函数。

时间:2021-09-28 15:45:12

I am using jQuery litebox. After adding JS and CSS files I got this error TypeError:

我使用的是jQuery litebox。在添加JS和CSS文件之后,我得到了这个错误类型错误:

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

Can anybody help me to understand the problem here?

有人能帮我理解这个问题吗?

I am doing this implementation in CakePHP 1.3.

我正在CakePHP 1.3中执行这个实现。

5 个解决方案

#1


49  

The problem may be if you are using older version of jQuery. Because older versions of jQuery have 'live' method instead of 'on'

如果您使用的是老版本的jQuery,问题可能就会出现。因为老版本的jQuery使用的是“live”方法而不是“on”

#2


26  

The usual cause of this is that you're also using Prototype, MooTools, or some other library that makes use of the $ symbol, and you're including that library after jQuery, and so that library is "winning" (taking $ for itself). So the return value of $ isn't a jQuery instance, and so it doesn't have jQuery methods on it (like on).

通常的原因是,您还在使用Prototype、MooTools或其他一些使用$符号的库,而且您还使用了jQuery之后的库,因此库是“成功的”(以$为代价)。所以$的返回值不是jQuery实例,所以它没有jQuery方法(比如on)。

You can use jQuery with those other libraries, but if you do, you have to use the jQuery symbol rather than its alias $, e.g.:

您可以使用jQuery和其他库,但是如果您使用jQuery,您必须使用jQuery符号,而不是它的别名$,例如:

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

And it's usually best if you add this immediately after your script tag including jQuery, before the one including the other library:

如果你在包括jQuery在内的脚本标签之后立即加上这个,这通常是最好的。

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

...although it's not required if you load the other library after jQuery (it is if you load the other library first).

…尽管在jQuery之后加载其他库是不需要的(如果您先加载另一个库)。

Using multiple full-function DOM manipulation libraries on the same page isn't ideal, though, just in terms of page weight. So if you can stick with just Prototype/MooTools/whatever or just jQuery, that's usually better.

但是,在同一页面上使用多个功能完整的DOM操作库并不理想,只是在页面权重方面。因此,如果你能坚持使用原型/MooTools/无论什么或者只是jQuery,那通常更好。

#3


8  

This problem is solved, in my case, by encapsulating my jQuery in:

在我的例子中,这个问题通过封装我的jQuery来解决:

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

#4


3  

If you are using old version of jQuery(< 1.7) then you can use "bind" instead of "on". This will only work in case you are using old version, since as of jQuery 3.0, "bind" has been deprecated.

如果您使用的是旧版本的jQuery(< 1.7),那么您可以使用“bind”而不是“on”。这只会在您使用旧版本时起作用,因为在jQuery 3.0中,“bind”已被弃用。

#5


0  

I tried the solution of Oskar (and many others) but for me it finaly only worked with:

我试过了Oskar(和其他许多人)的解决方案,但对我来说,它只适用于:

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

See: https://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/

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

#1


49  

The problem may be if you are using older version of jQuery. Because older versions of jQuery have 'live' method instead of 'on'

如果您使用的是老版本的jQuery,问题可能就会出现。因为老版本的jQuery使用的是“live”方法而不是“on”

#2


26  

The usual cause of this is that you're also using Prototype, MooTools, or some other library that makes use of the $ symbol, and you're including that library after jQuery, and so that library is "winning" (taking $ for itself). So the return value of $ isn't a jQuery instance, and so it doesn't have jQuery methods on it (like on).

通常的原因是,您还在使用Prototype、MooTools或其他一些使用$符号的库,而且您还使用了jQuery之后的库,因此库是“成功的”(以$为代价)。所以$的返回值不是jQuery实例,所以它没有jQuery方法(比如on)。

You can use jQuery with those other libraries, but if you do, you have to use the jQuery symbol rather than its alias $, e.g.:

您可以使用jQuery和其他库,但是如果您使用jQuery,您必须使用jQuery符号,而不是它的别名$,例如:

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

And it's usually best if you add this immediately after your script tag including jQuery, before the one including the other library:

如果你在包括jQuery在内的脚本标签之后立即加上这个,这通常是最好的。

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

...although it's not required if you load the other library after jQuery (it is if you load the other library first).

…尽管在jQuery之后加载其他库是不需要的(如果您先加载另一个库)。

Using multiple full-function DOM manipulation libraries on the same page isn't ideal, though, just in terms of page weight. So if you can stick with just Prototype/MooTools/whatever or just jQuery, that's usually better.

但是,在同一页面上使用多个功能完整的DOM操作库并不理想,只是在页面权重方面。因此,如果你能坚持使用原型/MooTools/无论什么或者只是jQuery,那通常更好。

#3


8  

This problem is solved, in my case, by encapsulating my jQuery in:

在我的例子中,这个问题通过封装我的jQuery来解决:

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

#4


3  

If you are using old version of jQuery(< 1.7) then you can use "bind" instead of "on". This will only work in case you are using old version, since as of jQuery 3.0, "bind" has been deprecated.

如果您使用的是旧版本的jQuery(< 1.7),那么您可以使用“bind”而不是“on”。这只会在您使用旧版本时起作用,因为在jQuery 3.0中,“bind”已被弃用。

#5


0  

I tried the solution of Oskar (and many others) but for me it finaly only worked with:

我试过了Oskar(和其他许多人)的解决方案,但对我来说,它只适用于:

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

See: https://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/

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