javascript - jQuery 插件 : If I want to call something like $ ('selector' ). plugin.group.method()，我该如何实现？

Question

我已经编写了一些相对简单的 jQuery 插件，但我正在考虑编写一些更高级的东西，以便使站点上的常用方法易于访问和 DRY

例如，我可能有这样的结构:

plugin- popup- element...=== popup ===- login- product...=== element ===- shoppingCart- loginStatus...

因此，要绑定(bind)弹出登录弹出事件，我希望能够做到:$('#login_button').plugin.popup.login();

执行此操作的最佳方法是什么？有没有更好的方法来实现我想做的事情？

干杯，

Answer 1

farhan Ahmad 的做法非常正确……它只需要更深的层次来满足您的需求，您的实现方式如下所示:

jQuery.fn.plugin = function(){
  //"community" (global to local methods) vars here.
  var selectedObjects = this; //-- save scope so you can use it later

  // return the objects so you can call them as necessary
  return {  
            popup: { //plugin.popup
                    login: function(){ //plugin.popup.login
                         //selectedObjects contains the original scope
                         console.log(selectedObjects);
                    },
                    product: function(){} //plugin.popup.product
            },
            element: { //plugin.element
                    shoppingCart: function() {}, //plugin.element.shoppingCart
                    loginStatus: function() {} //plugin.element.loginStatus
            }
         }
}

所以现在如果你调用:$("#someDiv").plugin.login(); 结果将如预期。我希望这会有所帮助。