javascript - 如何从 foo.onload = function(){ 获得响应？

Question

我有一个使用 .onload 触发的函数。我想返回一个值:

newImg.onload = function() {
    var height = newImg.height;
    var width = newImg.width;
    if(height > width){
        console.log(false);
        return false;
    } else {
        console.log(true);
        return true;
    }
 }
 newImg.src = imgSrc; // this must be done AFTER setting onload

通常我会做类似的事情

var foo = function(){...

但这在这种情况下不起作用。我应该怎么做？

Answer 1

异步调用不能返回值。您需要像在 Ajax 请求中那样使用回调。

function loadImg (imgSrc, callback) {
    var newImg = new Image();
    newImg.onload = function() {
        var height = newImg.height;
        var width = newImg.width;
        if(height > width){
            console.log(false)
            if(callback) callback(false);
        } else {
            console.log(true)
            if(callback) callback(true);
        }
     };
     newImg.onerror = function () {
         if(callback) callback('error');
     };
     newImg.src = imgSrc;

}

loadImg("foo.gif", function(status) { console.log("Do Next Step"); })