如何嵌套函数

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; 
}); 
}); 

Answer 1

您timg已经jQuery的OBJ，所以你不需要任何转换。你也使用全局var 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