1

.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(){...

しかし、これはこの場合は機能しません。代わりに何をすべきですか?

4

2 に答える 2

4

非同期呼び出しは値を返すことができません。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"); })
于 2013-05-16T12:21:47.183 に答える
0

2 つのオプションがあります。

  1. 値を別の変数に設定します。

    var foo;
    
    newImg.onload = function () {
        foo = true;
    };
    
    // Sometime later read `foo`.
    

    ...画像の読み込みに時間がかかるため、変数がいつ設定されるを保証できないため、これは災害が発生しやすいとはいえ。

  2. より良いオプションは、別の関数を呼び出し、渡したい値を渡し、それに応じて処理することです。

    newImg.onload = function () {
        foo(true);
    };
    
    function foo(result) {
        // do something with result
    }
    
于 2013-05-16T12:21:15.923 に答える