Question

我正在尝试为每个.png游戏资产创建一个图像对象。 makeImage()图像制作者确实创建了正确的对象，并且它具有正确的路径作为其.src属性，但它不会加载图像。 img.isReady仍为false。

我是javascript和编码的初学者，我想知道是否有一些我忽略的函数或对象的行为。

var assets = {};

function makeImage(path) {
    var img = new Image();
    img.isReady = false;
    img.onload = function () {
        img.isReady = true;
    };
    img.src = path;
    return img;
}

assets.tileset = makeImage('images/tileset.png');

Answer 1

工作小提琴：http://jsfiddle.net/anjrLy40/1/

问题是您在图像加载之前返回图像img，这是一个异步过程。您应该在onload函数中嵌套返回值。试试这个：

function createImg( path, nodeID ) { 

    var img = new Image(),
        isLoaded = false;

    img.onload = function() {

        document.getElementById( nodeID ).appendChild( img );

        isLoaded = true;

        alert(isLoaded);
    };

    img.src = path;
};

创建该函数并将其附加到img object，并在设置path后运行该过程并完成该过程。在某些人的代码中创建函数之前，您会看到src设置，但这不是首选方法。

参考：http://fragged.org/preloading-images-using-javascript-the-right-way-and-without-frameworks_744.html

Javascript：图像对象似乎没有加载图像

1 个答案: