javascript - 我该如何调试这个 JavaScript 错误？

Question

我被要求修复网站问题，但我遇到了 JavaScript 错误问题。

在主页上，[已删除网站链接]，我收到错误未捕获的类型错误:未定义不是函数。但是，当加载 jQuery 插件时，该行(第 30 行)上调用的函数应该存在。

调用堆栈仅显示一系列指向 jQuery 文件的匿名函数。我无法确定为什么会产生未定义的函数错误。

我尝试使用 Chrome 调试器单步调试发生错误的代码，但它似乎只是突出显示每个步骤的 jQuery 源文件。

我的问题是这样的:

1. 当线索只是 jQuery 源文件中的一系列匿名函数时，如何追踪问题的根源？
2. 有什么是我遗漏的或者没有考虑到的吗？

谢谢。

编辑:

目前尚不清楚，被调用的方法 jQuery.ContentSlider 实际上包含在文件 testimonials.js 的页面内。

这不仅仅是一个“我的代码出了什么问题”的问题，而且还询问我如何在 JavaScript 和 jQuery 的上下文中处理此类情况。

匿名函数的调用堆栈让我感到困惑，我已经尝试采取明显的步骤，例如验证插件是否包含在内，以及在尝试使用该插件之前是否发生了包含。

抱歉造成困惑。

编辑 - 找到解决方案

虽然 jQuery 和插件在使用前就已包含在内，但 Joomla! 却注入(inject)了同一 jQuery 文件的另一个副本!模块。由于这是完全相同的 Google 托管 jQuery 文件，因此它不会在 Chrome 开发人员工具的“资源”选项卡中出现两次。 Chrome 似乎会解析 jQuery 两次，但不会显示它被包含两次。因此，附加插件的版本被覆盖。

感谢各位的回答。感谢 A. Wolff 让我注意到有关“资源”选项卡的这条信息。

Answer 1

您在实例化 slider 后加载它。

颠倒这两个 block 的顺序:

    <script type="text/javascript">
        $(function() {
            jQuery('#two').ContentSlider({
                width : '440px',
                height : '240px',
                speed : 400,
                easing : 'easeOutQuad',
                textResize : true
            });
        });
    </script>

    <script src="/templates/sp/javascript/jquery.sudoSlider.min.js"></script>

编辑:对于关于调试的格式正确的问题的核心，通常，未定义不是一个函数，特别是在处理框架时，是尝试的症状在方法存在之前访问该方法，这就是为什么您尝试的函数调用返回 undefined 而不是函数。

这几乎总是是在尝试调用框架后加载框架的结果，或者在异步上下文中，不等待框架加载或执行重要操作的结果。

编辑2:上面的答案是不正确的，正如 A.Wolff 指出的那样:这并不是说你必须颠倒两个 block 的顺序，而是:1)第二个框架可能不是您想要的，或者2) 当您打算调用.sudoSlider(或任何适合该框架的内容)时，您已经调用了jQuery('#two').ContentSlider。