传递事件到jQuery的插件

Question

我刚开始的jQuery编写插件。我发现一个很好的教程如何开始，但有一点我错过了。我想为每个元素注册一个独立的插件对象，我需要它们的事件。

下面的代码我大气压：

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

我需要我的公开法“聚焦状态”和“的onblur”从“此”到“对象”复制？有没有更好的办法？

Answer 1

写的jQuery插件的最佳指导可能是jQuery's own。

jQuery's event system是处理事件给你的插件的最佳途径。如果你正在使用jQuery 1.7+（我建议，如果可能的话），.on()和.off()是你的工作母机。您不仅可以绑定浏览器事件，如重点和模糊，你可以创建一个像“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'); 
    }