javascript - 我如何使用相同的命名空间扩展 jquery 插件

Question

我创建了两个通用 jquery 插件文件。 “script1.js”和“script2.js”

一些项目需要“script1.js”，其他项目需要“script2.js”。我的新项目需要这两个插件。

我如何在相同的命名空间中使用这些插件。

我的命名空间是“abc”

script1.js
----------
(function($)
{
    $.fn.abc = function ()
    {
        return
        {
            foo1: function()
            {
                console.log("foo1");
            },

            foo2: function()
            {
                console.log("foo2");
            }
        }
    };
})(jQuery);

$(".element").abc().foo1(); //working fine - 'foo1'

script2.js
----------
(function($)
{
    $.fn.abc = function ()
    {
        return
        {
            foo3: function()
            {
                console.log("foo3");
            }
        }
    };
})(jQuery);

我可以用第二个插件扩展第一个插件吗？

$(".element").abc().foo3(); //expected print 'foo3'

$(".element").abc().foo1(); //expected print 'foo1'

几乎每个应用程序都需要 foo1 和 foo2。但并不是每个应用程序都需要 foo3。 foo3 是一个更大的插件。

Answer 1

引用这个答案。 Best Way to Extend a jQuery Plugin

更新:您是否可以编辑现有的 script1.js 插件

(function($) {
    $.fn.abc = function() {
        return {
            foo1: function() {
                console.log("foo1");
            },

            foo2: function() {
                console.log("foo2");
            },

            foo3: function() {
                console.log("foo3");
            }
        }
    };
})(jQuery);

执行此操作。

如果你想扩展.abc()的功能具有 .xyz() 函数的命名空间

$.fn.abc = function () {
     // here you can access public "members" of plugin xyz
     $.fn.pluginBar.foo3();
}


$.fn.xyz = function () {
    // private "members" (only this plugin can access them)
    var fn1 = function () { ... }
    var fn2 = function () { ... }

    return {
        foo3: function () { console.log("foo3") },
    };
}