javascript - 创建一个基本的 jquery 插件

Question

我是 jQuery 插件的新手，我已经关注了这个 Tutorial并通过以下代码摆脱困境:

  if (!($(this).attr('data-mobHigh') === undefined)) {
   $(this).attr("src", $(this).attr("data-mobHigh"));
  }

我正在像这样初始化插件

        $('img').mezzaraine();

我不知道第二个 $(this) 引用如何更改为 img，因为我向插件提供了参数 img第二行:

  $(this).attr("src", $(this).attr("data-mobHigh"));

this-(html 属性)也更改为 img。我需要使用 this 而不是“img”。

如何做到这一点？

Answer 1

您可以将this存储为局部变量。

$.fn.mezzaraine = function() {
    var $imgs = this;
    $imgs.each(function(i, img) {
        var $img = $(img); // wrap with $ if you want to chain jQuery methods

        // things you are going to do
    });
}

然后重用该变量，而不是每次都用 $ 包装。

if($img.attr('data-mobHigh') !== undefined) {
    $img.attr("src", $img.attr("data-mobHigh"));
}

此外，当您使用数据集时，jQuery 提供了更好的 API

if($img.data('mobHigh') !== undefined) {
    $img.attr("src", $img.data("mobHigh"));
}