Question

适用于IE6和FireFox;但由于某些原因不在IE7中。

在Page_Init上使用ASP.NET我填充了指向书中图像链接的章节列表以及包含pageID的javascript数组。

离。

第1章 - ＆gt; HREF = “JavaScript的：渗流（4）;”

这是我正在使用的实际代码：


var availablePages = ['1002_001','1002_002','1002_003','1002_004','1002_005'];

function seePage(index) {
    $get('imgSingle').src = 'graphics/loading.gif';
    var img = new Image();
    img.src = 'get.jpg.aspx?size=single&id=' + availablePages[index];
    img.onload = function() {
         var single = $get('imgSingle');
         single.src = img.src;
    }
}

当我点击第1章时，图像在整个板上加载（IE6,7，FF）并且点击第二章链接也可以正常工作;然而，在（并且仅在）IE7中点击同一章两次（第1章，第2章，然后是第1章）会使图像卡在“加载”图像上......我在这里拉出我的头发...

Answer 1

这是因为IE会缓存图像，并且onload事件在加载之后永远不会触发。

您需要在src之前定位onload事件。

var availablePages = ['1002_001','1002_002','1002_003','1002_004','1002_005'];

function seePage(index) {
    $get('imgSingle').src = 'graphics/loading.gif';
    var img = new Image();
    img.onload = function() {
         var single = $get('imgSingle');
         single.src = img.src;
    }
    img.src = 'get.jpg.aspx?size=single&id=' + availablePages[index];
}

Answer 2

另一种方法是检查图像是否已加载image.complete。例如：

var img = new Image();
img.src = 'foo.jpg';
if(img.complete){
    img.onload = function(){ /* ... */ };
} else {
    /* execute something else, or the same. */
}

我在IE6和7中遇到过这种行为。

image.onload在IE7中没有触发两次

2 个答案: