从JavaScript中的img.load（）返回img

我有一个for循环：

for(var i = 0; i < r.length; i++){
    var img=loadImage(r.id);
    $gallery.append(img);
}

---

在上面的函数中，我想返回img，以便在for循环中使用它，但这似乎不起作用，我没有显示图像。我知道我可以使用$gallery.append（这个）inside-load，它工作得很好，但我需要将上面的方法用于其他目的。有没有什么建议可以让我这样做？谢谢。

如果您需要元素：

function loadImage(id){
    var $url='url/'+id;
    var img = new Image();
    return $(img).load(function(){  
            return this;
        })
        .attr({'src':$url,'id':id})
        .get(0);
}

如果需要jQuery对象，请执行以下操作：

function loadImage(id){
    var $url='url/'+id;
    var img = new Image();
    return $(img).load(function(){  
            return this;
        })
        .attr({'src':$url,'id':id});
}

---

使用jquery的

load

事件来加载图像可能有点错误（取自：

• 它在跨浏览器中无法稳定工作，也不可靠
• 如果图像src设置为与以前相同的src，则在WebKit中无法正确触发
• 它不能正确地在DOM树上冒泡
• 对于已经存在于浏览器缓存中的图像，可以停止激发

在您的情况下，我将使用两种不同的方法之一：

• 回调
• 事件

通过回调，您可以在异步任务完成时执行某些功能：

function loadImage(id,callback){
    var $url='url/'+id;
    var img = new Image();
    $(img).load(function(){  
        if(typeof callback == 'function')
            callback(this);
         return this;
     }).attr({'src':$url,'id':id});
}

for(var i = 0; i < r.length; i++){
    var img=loadImage(r.id,function(_img){
         $gallery.append(_img);
    });

}

函数loadImage（id，回调）{
var$url='url/'+id；
var img=新图像（）；
$（img）.load（函数（）{
if（回调类型=='function'）
回调（这个）；
归还这个；
}).attr（{'src'：$url，'id'：id}）；
}
对于（变量i=0；i

有了活动，你就有了更大的力量……
您可以创建和触发自己的事件，并根据需要绑定任意多个EventHandler。
使用个人事件的示例：

function loadImage(id){
    var $url='url/'+id;
    var img = new Image();
    $(img).load(function(){  
        $(document).trigger('my_special_event',[this]);
     }).attr({'src':$url,'id':id});
}

for(var i = 0; i < r.length; i++){
    var img=loadImage(r.id);
}

$(document).bind('my_special_event',function(e,img){
     $gallery.append(img);
});

函数加载映像（id）{
var$url='url/'+id；
var img=新图像（）；
$（img）.load（函数（）{
$（document）.trigger（'my_special_event'，[this]）；
}).attr（{'src'：$url，'id'：id}）；
}
对于（变量i=0；i

为什么在非jQuery变量前面加上

$

？

function loadImage(id){
    var $url='url/'+id;
    var img = new Image();
    $(img).load(function(){  
        $(document).trigger('my_special_event',[this]);
     }).attr({'src':$url,'id':id});
}

for(var i = 0; i < r.length; i++){
    var img=loadImage(r.id);
}

$(document).bind('my_special_event',function(e,img){
     $gallery.append(img);
});