jQuery插件：如何在点击范围内调用并保持插件功能

Question

我有一个插件，每次点击指定的链接都会打开一个模式。我在插件的init（）函数中附加了click事件，然后运行插件的另一个函数。

虽然问题是插入函数调用点击不能访问插件的其他属性。它似乎在窗口的范围内调用，而不是插件。

因此在此示例中，toggleModal（）无法访问this.config.container。

如何在点击时触发插件功能，该功能位于插件范围内？

的插件如下：

;(function($, window, document, undefined){ 

var Modal = function(elem, options){ 
    this.elem = elem; 
    this.$elem = $(elem); 
    this.options = options; 
    this.metadata = this.$elem.data('modal-options'); 
}; 

Modal.prototype = { 
    defaults: { 
     container: '#pageModal' 
    }, 

    init: function() { 
     this.config = $.extend({}, this.defaults, this.options, this.metadata); 


     this.$elem.bind('click', this.toggleModal); 

     if(!$(this.config.container).length) { 
      this._build(); 
     } 

     return this; 
    }, 

    toggleModal: function() { 
     $(this.config.container).fadeIn(); 
     return false; 
    }, 

    _build: function() { 
     var structure = '<section id="' + this.config.container.replace('#', '') + '"><section class="modalContent"></section></section>'; 

     $(structure).appendTo($('body')).hide(); 
    }, 
} 

Modal.defaults = Modal.prototype.defaults; 

$.fn.modal = function(options) { 
    return this.each(function() { 
     new Modal(this, options).init(); 
    }); 
}; 

})(jQuery, window, document); 

Answer 1

这不是窗口，但jQuery对象你结合（如什么jQuery不会的产物）。 jQuery包含一个名为$.proxy的有用方法来解决此问题：

this.$elem.on('click', $.proxy(this.toggleModal, this));