Question

所以，我有这个：

function isOnline(sURL) {

    var bOnline,
        oImage = document.body.appendChild( document.createElement("img") );

    oImage.onload = function() {

        bOnline = true;

    };

    oImage.onerror = function() {

        bOnline = false;

    };

    oImage.src = sURL;

    return bOnline;

}

......之前我遇到过这个问题，但我在这里有点失落。如何在正确的时间将bOnline的值传递给isOnline？正如预期的那样，它返回undefined（最初）。任何帮助将不胜感激。

Answer 1

始终建议在下面给出的情况下使用回调函数

var online = false;

isOnline("htp://....", function(){
   online = true;
}, function(){
   online = false;
});

function isOnline(sURL, onLoad, onError) {

    var oImage = document.body.appendChild( document.createElement("img") );

    oImage.onload = onLoad;

    oImage.onerror = onError;

    oImage.src = sURL;

}

Answer 2

我强烈建议你使用回调继续你的逻辑：

 function isOnline(sURL, callbacks){
     var bOnline,
         oImage = document.body.appendChild( document.createElement("img") );
     oImage.onerror = callbacks.error;
     oImage.onload = callbacks.success;
     oImage.src = sURL;
 }

而不是像这样的电话：

if(isOnline('some-src')) {
    // good stuff
} else {
   // bad stuff
}

你应该使用像：

这样的功能

isOnline('some-src',{
    success : function(){
        // yey! image is online
    },
    error : function(){
       // eerror loading image. boo :((
    }
});

如果您仍希望在不使用回调的情况下在某个时间点进行测试，则可以返回实际的图像对象并在其上固定ready或error标记：

function isOnline(sURL) {
    var bOnline,
        oImage = document.body.appendChild( document.createElement("img") );
    oImage.ready = oImage.error = false;
    oImage.onload = function(){
        oImage.ready = true;
    }
    oImage.error= function(){
        oImage.error = true;
    }
    oImage.src = sURL;
    return oImage;
}


var img = isOnline('some-src');
// .. after some computing
if(img.ready) {
    // yey image  has loaded
} else if(img.error) {
   // damn error :(
} else {
   // still not loaded :-?
}

使用嵌套回调的值作为父函数的返回值

2 个答案: