如何修复 “Uncaught TypeError: $ Is Not a Function” 错误

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 有关。在网站加载过程中，如果执行了包含 “$” 符号的函数，就会遇到这个问题。

以下是导致该错误的一些潜在原因：

1. 没有正确加载 jQuery 库。如果 jQuery 库未正确加载或排队，”$” 符号将不会被识别为有效函数，并会产生错误。这在 WordPress 中通常不是问题，因为内容管理系统（CMS）会原生加载库。
2. 你是在无冲突模式下使用jQuery的。默认情况下，WordPress 是在 noConflict 模式下运行 jQuery 的。这意味着它无法识别作为函数名的 “$” 符号。要使用它，你需要采取变通方法。
3. 插件或主题冲突。某些插件或主题可能会有编码不当的 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 对象，或者将别名映射到不同的符号，以避免冲突。