Question

我想在完全加载后显示图像来实现这个功能，我尝试编写一些代码从图像中获取data-src并将其添加到新的Image对象中，在加载该对象后，它应该替换它image src与object src $(this)但是有问题，在嵌套函数$('li img').each(function(){ timg = $(this); var k = new Image(); k.src = $(timg).data('src'); $(k).load(function(){ console.log (k.src); $(timg).attr('src', k.src); //timg [$(This)] is not working; }); });中无法正常运行它只能获取最后一张图像是代码...

{{1}}

Answer 1

您的timg已经是jQuery obj，因此您不需要任何转化。您还使用全局变量timg，因此它在每次循环迭代中都会更改，因此只需使用local。

$('li img').each(function(){
    var timg = $(this);
    var k = new Image();
    k.src = timg.data('src');
    $(k).load(function(){
        console.log (k.src);
        timg.attr('src', k.src);
    });
});

Answer 2

使用Function.bind()明确告诉你的neastead函数你想成为它的this变量：

$('li img').each(function(){
    var k = new Image();
    k.src = $(this).data('src');
    $(k).load(function(){
        console.log (k.src);
        $(this).attr('src', k.src);
        console.log(this); // Shall work now
    }.bind(this));
});

更多细节：

// First case
function MyTest() {
    setTimeout(function() {
       console.log(this); // will log [object Window]
    });
}
// Second case
function MyTest() {
    setTimeout(function() {
       console.log(this); // will log "anything"
    }.bind("anything"));
}
// Another case
function MyTest() {
    setTimeout(function() {
       console.log(this); // will log [object Object] (MyTest)
    }.bind(this));
}

看这个Example

如何在嵌套函数中获取$（this）

2 个答案: