Передача событий в плагин jQuery

Question

Я только начал писать плагины для jQuery.Я нашел хороший учебник, как начать с него, но один момент я упустил.Я хочу зарегистрировать независимый плагин-объект для каждого элемента, и мне нужны их события.

Вот код, который я получил atm:

(function($){
     var MyPlugin = function(pElement, pOptions)
     {
        var element = $(pElement);
        var object = pElement;
        var settings = $.extend({
           param: 'defaultValue'
        }, pOptions || {});

        this.onfocus = function() {
            element.val('Focus');
        };

        this.onblur = function() {
            element.val('Blur');
        }

        // DO I NEED THIS?
        object.onfocus = this.onfocus;
        object.onblur = this.onblur;
    };

    $.fn.myplugin = function(options)
    {
        return this.each(function()
        {
            var element = $(this);
            if (element.data('myplugin')) { return };
            var myplugin = new MyPlugin(this, options);
                element.data('myplugin', myplugin);

        });
    };
})(jQuery);

Нужно ли копировать мои публичные методы "onfocus"и "онблур" от "этого" до "объекта"?Есть ли лучший способ?

Answer 1

Лучшим руководством по написанию плагинов jQuery, вероятно, является собственная jQuery .

Система событий jQuery - это лучший способ обработки событий для вашего плагина.Если вы используете jQuery 1.7+ (который я рекомендую, если это возможно), .on() и .off() - ваши рабочие лошадки.Вы можете не только привязывать события браузера, такие как focus и blur , вы также можете создавать полностью настраиваемые события, такие как 'iamasuperstar', и запускать их вручную с помощью this.trigger( 'iamasuperstar' ).

.вы бы сделали что-то подобное для своего плагина:

element.on( 'focus', function() {} )

element.on( 'blur', function() {} )

... и все, что вам нужно.

Answer 2

Почему бы и нет:

    object.onfocus = function() {
        element.val('Focus');
    };

    object.onblur = function() {
        element.val('Blur');
    }