为什么这个 jquery 扩展不起作用？答案

【问题标题】：Why is this jquery extension not working?为什么这个 jquery 扩展不起作用？
【发布时间】：2013-08-16 23:48:16
【问题描述】：

我有这个扩展功能，它似乎没有造成任何问题。但是当我尝试使用它时，我会收到一条错误消息：对象不支持属性或方法'n2name'

插件代码中没有报错（sn-p粘贴在下面供参考，末尾有完整文件的链接）。

有人知道为什么这不起作用吗？

注意：我正在尝试解决这个开源项目的一个问题：https://github.com/n2cms/n2cms/issues/279，并且可能有更多关于 Github 错误的有用细节。

对不起，如果这个问题太模糊，并且对于长代码 sn-p（大部分可能不相关）。但任何帮助都将不胜感激

/**
* n2name 0.2
*/

(function($) {

    /* some code removed for brevity */

    $.fn.n2name = function(options) {
        var invokeUpdateName = function(){
            updateName(options.titleId, options.nameId, options.whitespaceReplacement, options.toLower, options.replacements, options.keepUpdatedBoxId);
        };
        if(options.keepUpdatedBoxId){
           /* more code removed for brevity */
        }
    };
})(jQuery);;

链接到jquery.n2name.js完整源码，如果上面的sn-p代码没用的话：https://github.com/n2cms/n2cms/blob/4469580fcdd9c91f7576f07c3d2c8a4479ed6ce9/src/Mvc/MvcTemplates/N2/Resources/Js/plugins/jquery.n2name.js

【问题讨论】：

在插件加载到页面之前（或者根本没有加载），您似乎在调用$().n2name()。
这个jquery.n2name.js（上面定义了上面的脚本）在jquery-1.9.1-min.js和jquery-ui之后被包含在<head>中。失败的调用位于</body> 之前的<script> 标记中。这会证实你的怀疑吗？
确保插件脚本标签上没有 defer/async 属性，并且它的路径正确并且没有加载错误 - 或者只需打开控制台并输入 jQuery.fn.n2name看看它是否真的被加载了。
做到了。非常感谢！看起来我的 Visual Studio 副本由于某种原因无法从 localhost 加载资源（HTTP 请求在脚本调试器中显示为“已取消”）。当我将它上传到网络服务器时，它可以工作。奇怪...感谢您的帮助！

标签： javascript jquery n2cms

【解决方案1】：

“对象不支持属性或方法<name>”(IE) 和“<name> 不是函数”(Chrome) 错误通常意味着您的 jQuery 插件在调用之前没有成功加载。

这可能是由于请求失败（检查开发工具的网络选项卡），忘记/放错了插件的script 标记或具有defer/async 属性的script 标记。另一个可能的原因是插件的脚本包含语法错误（在这种情况下检查开发工具的控制台选项卡）。

在同一页面中拥有多个版本的 jQuery（如 OP 链接的 GH 问题中所述）是另一种可能性，因为包装在 (function(){}(jQuery)); 样板文件中的插件仅添加到当时 window.jQuery 引用的 jQuery 对象中插件脚本加载。

在这种特定情况下，OP 在 VS 中从 localhost 加载插件时遇到问题。

我看到过类似的问题，我只是补充一点，从file:/// URI 方案加载文件时使用无协议 URL（例如：//somecdn.com/library.js）是无效的。这是因为无协议 URL 从父文档“继承”了正在使用的协议，而 file:/// 不是协议。如果您从本地服务器加载它（例如，通过 http 提供的父文档，如 http://localhost/library.js），无协议 URL 应该可以正常工作。

【讨论】：