image.onload nicht zweimal in IE7

Question

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

Verwenden von ASP.NET auf dem Page_Init Ich befülle eine Liste der Kapitel, die Links zu dem Bild in dem Buch sind, sowie ein Javascript-Array, das die PageIDs enthält.

ex.

Kapitel 1 -> href = "javascript: seePage (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 auch auf einem zweiten Kapitel Link funktioniert ; In (und nur in) IE7 wird zweimal auf das gleiche Kapitel geklickt (Kapitel 1, Kapitel 2, dann wieder Kapitel 1). Das Bild bleibt jedoch auf dem "Lade" -Bild hängen ... Ich ziehe mir hier die Haare aus.

Answer 1

Es wird verursacht, weil IE das Bild zwischenspeichert, und das Onload-Ereignis wird nie ausgelöst, nachdem es bereits geladen wurde.

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

Ein anderer Weg, dies zu tun ist, wenn das Bild zu überprüfen, 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.