2

我最近一直在开发一些 jQuery 小部件，但有两件事一直困扰着我，所以我来找你，希望你能有更好的方法来做这件事。

1）我非常喜欢使用“那个”而不是这个的事实。使代码更清晰，避免了很多错误。为了简单起见，我总是使用“that”作为小部件的 this。但是我不知道如何使我的“那个”全球化，所以我要做的是：

$.widget("widgetName", {
    method1: function() {
        var that = this;
    },
    method2: function() {
        var that = this;
    }
});

如您所见，这在代码中很繁重，而且也好不到哪里去。我想知道我是否可以这样做：

 var that = $.widget("widgetName", {
     method1: function() {
         //do something
     },
     method2: function() {
         //do something
         that.method1();
     }
  });

或者这会带来什么问题吗？如果这是不可能的，你认为最好的方法是什么？

2）这确实与我的第一个问题相关，并且对它的回答应该足够了：对于我的事件处理程序，我经常需要使用我的“那个”来调用例如方法。所以我目前做的是

 $.widget("widgetName", {
     _handlers: {},
     _create: function() {
         var that = this;
         that._handlers: {
             handler1: function(e) { 
                 //do something
                 that.method();
             } //...
         };
         that.on("event", that._handlers.handler1);
     },
     method: function() {}
 });

你有没有更好的方法可以做到这一点？我最大的需要是能够将 that._handlers 的整个初始化移出 that._create

这些都是相当开放的问题。我真的想找到一种方法让我的 jquery 小部件真正清晰和可维护，我很想知道人们是怎么做的。

非常感谢您对此的意见。

4

1 回答 1

7

为了扩展我的评论，这里是你如何绑定你的处理程序以保留this

 $.widget("widgetName", {
     _handlers: {},
     _create: function() {
         this._handlers.handler1 = $.proxy(function(e) { 
                 //do something
                 this.method();
         }, this);
         this.element.on("event", this._handlers.handler1);
     },
     method: function() {}
 });

或者您可以交换它，以便轻松覆盖 3rd 方开发人员的处理程序：

 $.widget("widgetName", {
     _handlers: {
         handler1: function(e) { 
             //do something
             this.method();
         }
     },
     _create: function() {
         this.element.on("event", $.proxy(this._handlers.handler1,this));
     },
     method: function() {}
 });

编辑：如果你真的想要一个全局that变量，这是一种不污染全局范围的方法：

(function($){
     var that;
     $.widget("widgetName", {
         _handlers: {
             handler1: function(e) { 
                 //do something
                 that.method();
             }
         },
         _create: function() {
             that = this;
             this.element.on("event", this._handlers.handler1);
         },
         method: function() {}
     });
})(jQuery);
于 2012-10-05T19:40:17.337 回答