2013-02-22 66 views
0

在预加载图像和动态创建元素时遇到问题。该脚本加载图像URL列表,创建画布元素等Chrome/Firefox缓存的图像问题

问题是,随后的“软”刷新或提交相同的URL预加载循环不启动,所以画布元素等创建。我非常确定这与资源缓存有关 - 但是 - 为什么脚本没有通过图像URL列表迭代并按预期构建DOM我不确定... Here's an example

JavaScript on页面优化输出,但预压循环如下所示:

// Images array 
var images = []; 

for (var i = 0; i < l.length; ++i) { 
    // Create canvas element 
    var canvas = document.createElement('canvas'); 
    // Canvas element properties 
    canvas.width = l[i].w; 
    canvas.height = l[i].h; 
    canvas.style.display = 'none'; 
    // Image element + mouse over event 
    images[i] = document.getElementById('i' + i).getElementsByTagName('img')[0]; 
    images[i].addEventListener('mouseover', function() { 
     handleCanvas(this); 
    }, false); 
    // Push canvas into DOM 
    images[i].parentNode.insertBefore(canvas, images[i]); 
    // Preload item from processed images list 
    var image = new Image; 
    image.src = l[i].i; 
} 

我不希望诉诸标题或“URL随机= 37436464?”的类型,如果可能的修复。在Ubuntu 12.10上测试Chrome和Firefox的夜间版本。

回答

0

经过进一步调查(在IE9中测试)后,似乎问题是由JavaScript和滞后变量启动的异步加载造成的。