WordPress完全支持 JavaScript 和 jQuery 库。不过,WordPress 实现 jQuery 的方式可能会在您尝试执行函数时导致错误。最常见的问题之一就是 “Uncaught TypeError: $ is not a function” 错误。
如果你了解了导致这种错误的原因,那么排除这种错误就相对简单了。”$” 别名是问题的核心,jQuery 和 WordPress 提供了几种方法来规避它,以便你可以运行你需要的函数。
在本文中,我们将解释什么是 “Uncaught TypeError: $ is not a function”(未捕获的类型错误:$ 不是函数)错误,以及导致该错误的原因。然后,我们还会告诉你如何排除故障。
什么是WordPress中的 “Uncaught TypeError: $ Is Not a Function” 错误?
Uncaught TypeError: $ is not a function “错误是一种常见的 JavaScript 错误,当jQuery库加载不正确或与其他使用 “$” 符号的脚本发生冲突时就会出现。
在WordPress中,这个错误与内容管理系统(CMS)如何实现jQuery有较大关系,而与加载问题关系不大。
jQuery 是一种流行的 JavaScript 库。它广泛应用于 WordPress 主题和插件,用于处理各种动态元素、动画和 AJAX 操作:
jQuery 库
在 jQuery 中,”$” 符号是 jQuery 对象的别名,它是与库交互时的主要对象。它使代码更短、更易读、更易写。
Uncaught TypeError: $ is not a function”(未捕获的类型错误:$ 不是函数)有点难以排除故障,因为你看不到明确的错误信息。与 WordPress 的其他错误不同,网站上配置错误的元素甚至 404 错误页面都可能引发这个问题:
404错误 – “未找到页面”
诊断问题的最有效方法是查看开发人员控制台或使用 WordPress 调试日志。
导致 “Uncaught TypeError: $ Is Not a Function” 错误的主要原因是什么?
“Uncaught TypeError: $ is not a function” 错误与 jQuery 有关。在网站加载过程中,如果执行了包含 “$” 符号的函数,就会遇到这个问题。
以下是导致该错误的一些潜在原因:
- 没有正确加载 jQuery 库。如果 jQuery 库未正确加载或排队,”$” 符号将不会被识别为有效函数,并会产生错误。这在 WordPress 中通常不是问题,因为内容管理系统(CMS)会原生加载库。
- 你是在无冲突模式下使用jQuery的。默认情况下,WordPress 是在 noConflict 模式下运行 jQuery 的。这意味着它无法识别作为函数名的 “$” 符号。要使用它,你需要采取变通方法。
- 插件或主题冲突。某些插件或主题可能会有编码不当的 JavaScript,从而影响 jQuery 的正常运行,或者在使用 “$” 符号时导致其他脚本出现问题。
总之,WordPress 的配置无法识别 “$” 符号。不过,这并不意味着你不能在内容管理系统中运行 jQuery 代码。毕竟,jQuery 库是 WordPress 的一部分。您需要做的是使用变通方法来避免 “$” 符号带来的问题。
如何修复 “Uncaught TypeError: $ Is Not a Function” 错误(2种方法)
在我们开始工作之前,有一点很重要,那就是 jQuery 已经是 WordPress 的一部分了。有些教程会指导你启用 jQuery,但这个库已经成为内容管理系统(CMS)的一部分有一段时间了。
WordPress 还以 “noConflict” 模式运行 jQuery。这意味着它会释放 “$” 符号,以便其他库可以使用它。与其禁用 “noConflict “模式,不如这样解决这个问题。
1. 使用 “jQuery” 而不是”$”
如果在函数中使用 “$” 符号时遇到问题,可以使用 “jQuery” 来代替。下面是一个使用 “$” 的基本 jQuery 函数的示例:
$(function() { // Your code here will run once the DOM is ready });
在这种情况下,一个快速的解决办法是用 jQuery 替换 “$” 符号。这样,代码就会如下所示:
jQuery(function() { // This code will not trigger the error });
或者,你也可以将代码 “封装” 在一个包含 jQuery 符号的立即调用的函数表达式中。下面的示例不会触发 “Uncaught TypeError: $ is not a function”(未捕获的类型错误:$ 不是函数)错误,因为它使用了 jQuery 符号作为封装:
jQuery(function ($) { // You can use $ inside the wrapper console.log($('.primary-menu')); });
修改代码后,可以使用浏览器的开发人员控制台或 WordPress 调试日志查看错误是否仍然存在。如果仍然存在,您可能需要将 “jQuery” 映射到另一个符号,以避免出现更多错误。
2. 在 jQuery 中使用自定义别名
“$” 是 jQuery 对象的默认别名。不过,由于 WordPress 是在无冲突模式下运行 jQuery 的,因此您可能需要映射一个替代别名,以避免与其他库发生冲突。
这个过程相对简单,只需一行代码就可以将别名映射到一个新符号上:
vvar $j = jQuery;
这段代码将默认别名替换为 “$j”,但也可以是其他任何你想要的名字。一些开发人员更喜欢这种方法,而不是像我们在前面的方法中展示的那样,必须键入完整的 “jQuery” 对象。
如果你不确定在哪里添加这段代码,可以阅读我们的教程,了解如何在WordPress的页眉和页脚添加代码。请记住,即使你注册了一个新的别名,你仍然可以使用 “jQuery “来代替那个符号。
小结
WordPress 可以让你在网站上使用 jQuery。不过,如果你想避免诸如 “Uncaught TypeError: $ is not a function”(未找到类型错误:$不是函数)之类的错误,就需要了解内容管理系统是如何实现该库的。WordPress 使用 jQuery 的 “noConflict” 模式,这意味着它不识别 “$” 符号。
当你试图使用一个使用 “$” 调用 jQuery 的函数时,就会出现 “Uncaught TypeError: $ is not a function” 错误。为了避免这个问题,你可以键入完整的 jQuery 对象,或者将别名映射到不同的符号,以避免冲突。
原文地址:https://www.wbolt.com/uncaught-typeerror-is-not-a-function.html