jQuery 插件创作 : explanation for "this" keyword?

Question

我使用 jQuery 编码已有大约 2 年了，但我从未在插件中完成过。我正在努力改变这一点。我找到了一些解释如何创建插件的网站，我了解了基础知识。

我不明白的部分是 this 关键字的使用。这是一个简单的插件示例:

(function($){
  $.fn.myPlugin = function(options)
  {
    // Do whatever
    return this.each(function(){
      element = $(this);
    });
  }
  $.fn.myPlugin.init = function()
  {
    // Initiate plugin
  }
})(jQuery);

在代码的第 5 行，我有 this.each。在本例中，this 关键字引用选择器中的所有元素。下面的行使用 $(this) 这是 current 元素，就像我在 .click(function(){$( this).hide();}).

现在，在面向对象逻辑中，通常我们有一个 this 关键字来引用内部函数或属性。如果在 $.fn.myPlugin 中我想调用 $.fn.myPlugin.init()，我希望能够执行类似 this 的操作。 init() 但它似乎不起作用。

此外，我希望能够以类似的方式定义类属性，例如 this.myVariable = "my value"。

因此，如果有人可以解释我在理解 jQuery 插件概念时所缺少的内容，或者通过相关链接为我指明正确的方向，我将不胜感激!如果我的解释不够清楚，请告诉我，我会尽力改进，但现在我的脑海里有点模糊。 ;)

Answer 1

在进入 .each() 之前，this 实际上是包含匹配 DOM 元素集的 jQuery 对象。

如果您想以这种方式调用该函数，则需要在添加该函数的作用域中调用它。 $.fn.myPlugin.

this.myPlugin.init();

或者在每个里面像这样:

$(this).myPlugin.init();

或者直接像这样:

$.fn.myPlugin.init();