javascript - jQuery - 方法链接的插件和命名空间问题

Question

我正在尝试创建一个可以通过以下方式调用的简单插件:$.myPlugin() 和 $('something').myPlugin()

代码如下:

(function($) {
  $.fn.myPlugin = function(item) {
    return this;
  };

  $.myPlugin = function(item) {
    return $.fn.myPlugin(item);
  };
}(jQuery));

当以上述任何一种方式调用时，这都有效。

但是，调用 $.myPlugin().hide() 确实不起作用。任何链式方法都会失败。

Heres a simple JSBin I made showing the issue

为什么？

Answer 1

您应该返回$(this)，而不是jquery this:

(function($) {
    $.fn.myMethod = function() {
      this.append('<p>MY METHOD</p>');

      return $(this);
    };

    $.myMethod = function() {
      return $.fn.myMethod();
    };
}(jQuery));

$(function () {
    // Moment of truth
    $('.output').myMethod().hide('slow');

    $('h1').click(function(){
      $('.output').myMethod().hide();
    });
});