lazyload jquery 回调函数

lazyload jquery callback function

本文关键字：函数 回调 jquery lazyload      更新时间：2023-09-26

我目前在延迟加载渲染图像时调用一个函数。这工作正常。我遇到的问题是我需要访问函数中的$(this)。有没有办法将这些数据解析为函数？

小提琴 http://jsfiddle.net/DTcHh/19852/

$("img").lazyload({
  load: equalizeHeights
});
function equalizeHeights() 
{
  //var classStr = '.'+$(this).parent('div').attr('class');
  var classStr = '.my-wrapper';
  var heights = $(classStr).map(function() {
      return $(this).height();
    }).get(),
    maxHeight = Math.max.apply(null, heights);
  $('.my-wrapper').height(maxHeight);
}
您可以使用

Function.prototype.bind()来附加this的值

例：

var obj= {
 someData: "Hello"
}
function printSomeData() {
  console.log(this.someData);
}
var customFunction = printSomeData.bind(obj);
customFunction(); //withing the function, "this" is obj, so it will print "Hello"

所以在你的情况下，我想你可以使用类似的东西

$("img").lazyload({
  load: equalizeHeights.bind($("img"))
});

（不确定你想用的"这个"是什么）

您正在使用的插件实际上具有回调函数。 示例：

$("img.lazy").lazyload({
    load : function(elements_left, settings) {
        console.log(this, elements_left, settings);
        $(document).trigger("something");
    }
});

在您的情况下，您可以像这样使用它：

演示 http://jsfiddle.net/DTcHh/19856/

$("img").lazyload({
  effect: "fadeIn",
  threshold: 300,
  failure_limit: 10,
  load: function(elements_left, settings) {
    equalizeHeights(this);
  }
});
function equalizeHeights(ele) 
{
  var classStr = '.'+$(ele).parent('div').attr('class');
  var heights = $(classStr).map(function() {
      return $(this).height();
    }).get(),
    maxHeight = Math.max.apply(null, heights);
  $('.my-wrapper').height(maxHeight);
}

我认为这就是您所追求的用例。

相关文章：