javascript - 检查背景图像是否已加载

Question

这是我的代码:

$('<div>')
    .css('background-image', 'url(' + images[imageToLoad].url + ') no-repeat center center')
    .appendTo('#image-container')
    .hide()
    .load(function () {
        loadedImages.push($(this));
    });

背景图像加载后，load 事件永远不会在此处触发。我应该捕获什么事件才能知道背景何时加载？

Answer 1

@variant 所说的 + 代码，因为 img onload 事件并不总是触发:

var img = new Image(),
    div = $( "<div>" ).appendTo( "#image-container").hide();        

img.onload = function(){
    if( this.isLoaded ) {
    return;
    }
this.isLoaded = true;
loadedImages.push( 
    div.css( "background-image", "url('"+this.src+"') no-repeat center center" )
    );
}

img.src = images[imageToLoad].url;

if( ( img.complete || img.readyState === 4 ) && !img.isLoaded ) {
img.onload();
}