image.onload не се задейства два пъти в IE7

Работи в IE6 и FireFox; но по някаква причина не в IE7.

Използвайки ASP.NET на Page_Init, попълвам списък с глави, които са връзки към изображението в книгата, както и Javascript масив, който съдържа pageIDs.

ex.

Глава 1 --› href=javascript:seePage(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 щракването върху една и съща глава два пъти (chap1, chap2, след това отново chap1) дали изображението засяда върху изображението за „зареждане“...


javascript dom-events internet-explorer-7
person John West    schedule 24.06.2009    source източник
comment
обичам jquery плъгина за суап изображение code.google.com/p/jquery-swapimage   -  person Haim Evgi    schedule 24.06.2009

Отговори (2)


arrow_upward
10
arrow_downward

Причината е, че IE ще кешира изображението и събитието onload никога няма да се задейства, след като вече е заредено.

Трябва да позиционирате събитието onload преди src.

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];
}
person Ian Elliott    schedule 24.06.2009
comment
Нека Бог ви благослови с безкрайно много бира, сър. - person John West; 24.06.2009

arrow_upward
2
arrow_downward

Друг начин да направите това е да проверите дали изображението вече е заредено с 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.

person sholsinger    schedule 08.01.2010