Javascript: document.images[].complete 在 IE 中不工作

Question

我有一个已经运行了很长时间的幻灯片。我正在将站点更新为 XHTML transitional，但现在幻灯片放映在 IE 9 中不起作用。

看来问题是“完成”功能不起作用。以下代码启动幻灯片放映(在页面加载后调用):

function Initialize() {
    document.images["carImg"].src = imgList[0];
    if (document.getElementById) {
        theLink = document.getElementById("linkTo");
        theLink.href = imgURL[0];
    }
    if (document.images["carImg"].complete) SetTheInterval();
    else setTimeout("Initialize()", 1000);
}

document.images["carImg"].complete 始终解析为 false，因此它每秒调用一次 Initialize。图片 imgList[0] 已加载，因为它正在显示。但是没有设置完整的属性。

如果我注释掉 if (document.images["carImg"].complete) 条件，并且只调用 SetTheInterval()，幻灯片放映就可以了。

它也适用于 Firefox(有条件)。如果我将 IE 9 设置为“兼容性 View ”，它也会起作用(尽管其他东西看起来很奇怪)。

有谁知道为什么“完整”属性没有在 IE 9 中设置？有什么变化吗？

更新:似乎完整的是仅没有处理第一张图片。对于后续图像，加载图像时设置完成。

Answer 1

尝试查看是否存在 onload 或错误事件，即使重置 src 也可能会产生无法立即完成的“脏”图像，即使该图像存在也是如此。

我以前没有注意到这一点，但在 IE10(没有 9)中你需要 onload 事件。当 onload 触发时，complete 为 true，但一旦写入 img src，它又为 false。您也可以只设置一次 src，然后在超时时检查完成。

如果没有 onload 处理程序，即使在图像出现后，计时器也会一直持续下去......

window.ready=function(){
    var img= document.images[0];
    img.onload= function(){
        clearTimeout(ready.timer);
        alert('onload called, img.complete= '+img.complete);              
    };
        // temporary error handler, if needed
        img.onerror=function(e){              
               clearTimeout(ready.timer);
               alert('Error!\n'+e.message || e);
        };
       // set the new src
    img.src= Memry.Rte+'art/sundrag.gif';
    if(!img.complete) ready.timer=setTimeout(window.ready, 300);
    else alert('complete');
}
ready()