混合程序和事件

我有一個加載圖像，並檢查它是否成功加載的功能。（要查看瀏覽器是否支持WebP的）混合程序和事件

的問題是，我必須使用的onload（）和的onerror（）對於這一點，這意味着我不能簡單地返回一個值。

我如何可以延遲返回，直到事件觸發？

這裏是我的代碼：

function start_check_webp(){ 
    var div = document.createElement('div'); 
    div.innerHTML = '<img id = "test_image" src="test_image.webp">'; 
    webp_test = div.firstChild; 
    div.firstChild.onerror = function(){support_webp = false} 
    div.firstChild.onload = function(){support_webp = true} 
}

來源

2011-04-07 snostorm

你不能。您需要重構代碼以處理異步事件。您可以讓它們調用一個函數，如果支持WebP或者其他方式，它實際上會做些什麼，而不是讓事件處理函數設置變量。

來源

2011-04-07 01:48:04 casablanca

好吧......這是我的另一種選擇，但我更喜歡得到yes \ no值。只是爲了檢查，沒有任何方法可以查明圖片加載是否在沒有使用事件的情況下失敗，是嗎？ – snostorm 2011-04-07 01:51:17

@snostorm：不幸的是沒有。瀏覽器需要首先從服務器加載鏡像，這必然會使鏡像異步。（JavaScript中沒有阻止調用。） – casablanca 2011-04-07 01:55:49

好的，謝謝。 – snostorm 2011-04-07 01:57:05

結構代碼，使其運行一次加載圖像。您可以通過使用數據URI而不是外部圖像來加快處理速度。例如：

function testWepP() { 
    var webP = new Image();  
    webP.src = 'data:image/webp;base64,UklGRjoAAABXRUJQVlA4IC4AAACyAgCdASoCAAIAL' + 
    'mk0mk0iIiIiIgBoSygABc6WWgAA/veff/0PP8bA//LwYAAA'; 
    webP.onload = webP.onerror = function() { 
    callback(webP.height === 2);  
    }; 
}; 

testWebP(function(supported) { 
    console.log((supported) ? "webP supported!" : "webP not supported."); 
});

來源

2012-08-08 14:04:10

混合程序和事件

回答

相關問題