[英]I want to preload an array of images in javascript and pause until they are all loaded
我有一個代碼,該代碼取決於首先加載的大型圖像數組,因此我正在嘗試執行以下操作:
var loading = 0;
var i = 0;
var imgs = [];
var background = [
'bg1-1', 'bg1-2', 'bg1-3', 'bg1-4',
'bg2-1', 'bg2-2', 'bg2-3', 'bg2-4',
'bg3-1', 'bg3-2', 'bg3-3', 'bg3-4',
'bg4-1', 'bg4-2', 'bg4-3', 'bg4-4'
];
for (i = 0; i < background.length; i++) {
imgs[i] = document.getElementById(background[i]);
imgs[i].onload = function() {
loading++;
}
}
while (loading < 16) { }
alert('images loaded!'); //I need to ensure images are fully loaded here.
因此,它只是掛起而從未退出while循環。
將條件和警報放入回調中。
var loading = 0;
for (i = 0; i < background.length; i++) {
imgs[i] = document.getElementById(background[i]);
imgs[i].onload = function() {
loading++;
if (loading >= background.length)
alert("all done");
}
}
確實,最好重用該功能。
var loading = 0;
function imgHandler() {
loading++;
if (loading >= background.length)
alert("all done");
}
for (i = 0; i < background.length; i++) {
imgs[i] = document.getElementById(background[i]);
imgs[i].onload = imgHandler;
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.