找不到自定義jQuery插件

Question

我在myPlugin.js中開發了一個jQuery插件，如下所示：

(function ($) {
    $.fn.myPlugin = function (options) {

        var defaults = {};

        var settings = $.extend(defaults, options);

        return this.each(function () {
            this.sayHello = function () {
                alert('Hello!');
            };
        });
    };
})(jQuery);

我正在從另一個文件call.js調用sayHello()方法，如下所示：

myPlugin.sayHello();

HTML文件中包含myPlugin.js和call.js。 當編譯器進入myPlugin.sayHello(); 它報告錯誤Uncaught ReferenceError: myPlugin is not defined 。

我的代碼有什么問題？

更新

我找到了解決方案。 我在代碼中的某個地方初始化了一個特定元素的插件，例如。 $('#someElement').myPlugin(); 。 我只需要使用someElement.sayHello();調用一個插件函數即可someElement.sayHello(); 並且有效。

另一個解決方案如@antyrat建議。

Answer 1

 (function ($) { $.fn.myPlugin = function (options) { var defaults = {}; var settings = $.extend(defaults, options); return this.each(function () { this.sayHello = function () { alert('Hello!'); }; }); }; })(jQuery); $( 'body' ).myPlugin(); console.log($( 'body' )) $( 'body' )[0].sayHello(); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

您已經通過使用fn快捷方式（ prototype ）擴展了jQuery對象。 因此，您需要將插件作為jQuery方法調用：

$.myPlugin.sayHello();

---

更新資料

從我的代碼中可以看到，如果要調用sayHello函數，則需要在某些元素上對其進行初始化，例如：

$( 'body' ).myPlugin();

然后調用您的方法：

$( 'body' )[0].sayHello();

[0]因為this.sayHello = function () {我們需要this.sayHello = function () {指的是DOM元素，而不是jQuery