image.onload nicht zweimal in IE7 Brennen

Question

Es funktioniert in IE6 und FireFox; aber aus irgendeinem Grund nicht in IE7.

Mit ASP.NET auf dem Page_Init ich eine Liste von Kapiteln bevölkere, die Links zu dem Bild in dem Buch sind auch als JavaScript-Array, das das pageIDs hält.

ex.

Kapitel 1 -> href = "javascript: Versickerung (4);"

Hier ist der eigentliche Code verwende ich:

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;
    }
}

Wenn ich auf Kapitel 1, die Bild Lasten fein auf der ganzen Linie (IE6,7, FF), und klicken Sie auf ein zweites Kapitel Link funktioniert auch; jedoch in (und nur in) IE7 auf demselben Kapitel wird, klicken zweimal (chap1, kap2, dann chap1 wieder) wird das Bild auf dem ‚Laden‘ Bild stecken ... Ich ziehe mal meine Haare hier Jungs .. .

Answer 1

Es wird dadurch verursacht, dass IE wird das Bild zwischenzuspeichern, und das Onload-Ereignis wird nie ausgelöst, nachdem es bereits geladen worden ist.

Sie müssen das Onload-Ereignis vor dem src positionieren.

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

Eine andere Möglichkeit, dies zu tun, ist zu überprüfen, ob das Bild bereits mit image.complete geladen wird. Zum Beispiel:

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

Ich habe dieses Verhalten in IE6 erlebt und 7.