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));

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

1 个答案: