如何解决WordPress站提示TypeError: $ is not a function when calling jQuery function的问题

导语:有时候,在WordPress中开发或使用jQuery时,会出现TypeError: $ is not a function when calling jQuery function的问题,那我们应该怎么来解决这个问题。

现象

我在WordPress插件中有一个简单的jQuery脚本,它使用如下的jQuery包装器:

$(document).ready(function(){

    // jQuery code is in here

});

我从WordPress仪表板中调用此脚本,并在jQuery框架加载后加载它。

当我在Firebug中检查页面时,不断收到错误消息:

TypeError: $ is not a function

$(document).ready(function(){

我是否应该将脚本包装在此函数中:

(function($){

    // jQuery code is in here

})(jQuery);

这个错误我已经发生过好几次了,应该怎么处理才对。

解决问题

默认情况下,当您将jQuery加入Wordpress时,您必须使用jQuery,并且不使用“$”(这是为了与其他库兼容)。

将“$”包装在函数中它将工作得很好,或者您可以通过其他方式加载jQuery(但在Wordpress中这可能不是一个好主意)。

如果您必须使用document.ready,您实际上可以将“$”传递到函数调用中:

jQuery(function ($) { ...

完整示例

jQuery(document).ready(function($){
  //现在可以使用$作为jQuery对象。
  var body = $( 'body' );
});

简而言之,WordPress在你自己的脚本之前运行WordPress的脚本,并且WordPress的脚本会释放$var,这样它就不会与其他库冲突。这完全有道理,因为WordPress被用于各种网站、应用程序,当然还有博客,所要求的兼容性太高,因此它必须避免一些问题。

从他们的文档中可以看到:

WordPress附带的jQuery库被设置为noConflict()模式(参见wp-includes/js/jquery/jquery.js)。这是为了防止与WordPress可以链接的其他JavaScript库的兼容性问题。

在noConflict()模式下,jQuery的全局“$”快捷方式不可用.

结束

你学会了吗?

发表评论

电子邮件地址不会被公开。 必填项已用*标注