命名空间 jQuery 插件

Question

假设我们有以下 jQuery 插件（每个插件都在单独的文件中）：

• $.fn.foo
• $.fn.foo.bar
• $.fn。 foo.baz

我使用标准 jQuery 插件模式。第一个实际上是其名称空间的其余插件的代理或“外观”。 例如，当我调用 $('#el').foo() 时，在幕后我也会调用：

var context = this; // context is equal to $('#el')
$(context).foo['bar'].apply(context);
$(context).foo['baz'].apply(context);

当我只想调用only时，有两个问题（不带 $.fn.foo) $('#el').foo.bar()。第一个问题是没有 $.fn.foo 命名空间，但我可以创建它，所以这实际上没有问题。第二个问题是 $.fn.foo.bar 中的 this 等于 document 对象，但我想等于 $('#el').我怎样才能做到这一点？

因此，长话短说，两者都应该有效：

$('#el').foo();     // This also calls foo.bar and foo.baz under the hood
$('#el').foo.bar(); // I'm calling foo.bar explicitly

Answer 1

我认为您可能只需要遵循不同的插件模式。这是一个很好的 jQuery 插件模式存储库，但您可能想看看将是 命名空间模式 - 如果名称空间尚不存在，您将看到名称空间最初是如何定义的，这使您可以更轻松地从单个名称空间跨多个脚本进行扩展。

---

更新：嗯，我还在学习，所以我不会说我是这方面的专家，但试图得到这个 $('#el').aaa.bbb.ccc()工作对我来说真的很混乱。也许最好不要使用这种格式，而是这样做（demo）：

$.aaa.bbb.ccc( $("#el") );

因为这样就可以了设置起来相对容易：

(function() {
    if (!$.aaa) {
        $.aaa = {
            bbb : {
                ccc: function(el, options){
                    alert(el[0].id);
                }
            }
        };
    };
})(jQuery);

$(function() {
    $.aaa.bbb.ccc( $("#el") ); // alerts "el"
});