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

Normaly我会做类似

的事情

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

Answer 2

您有两种选择;

将值设置为另一个变量。
```
var foo;

newImg.onload = function () {
    foo = true;
};

// Sometime later read `foo`.
```
...虽然这很容易发生灾难，因为您无法保证何时设置变量，因为图片将花费一些的时间来负荷。

更好的选择是调用另一个函数，传递您想要传递的值，然后相应地处理它。

newImg.onload = function () {
    foo(true);
};

function foo(result) {
    // do something with result
}

如何从foo.onload = function（）获得响应{？

2 个答案: