image.onload non si attiva due volte in IE7
-
10-07-2019 - |
Domanda
Funziona in IE6 e FireFox; ma per qualche motivo non in IE7.
Utilizzando ASP.NET su Page_Init Popolo un elenco di capitoli che sono collegamenti all'immagine nel libro, nonché un array javascript che contiene gli ID pagina.
es.
Capitolo 1 - > href = " javascript: infiltrazioni (4); "
ecco il codice attuale che sto usando:
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;
}
}
Quando clicco sul Capitolo 1, l'immagine si carica bene su tutta la linea (IE6,7, FF) e anche facendo clic su un secondo capitolo funziona; tuttavia, in (e solo in) IE7 fa doppio clic sullo stesso capitolo due volte (chap1, chap2, quindi chap1) l'immagine si blocca sull'immagine di "caricamento" ... Sto tirando fuori i capelli qui ragazzi ... .
Soluzione
È causato dal fatto che IE memorizzerà nella cache l'immagine e l'evento onload non verrà mai generato dopo che è già stato caricato.
Devi posizionare l'evento onload prima di 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];
}
Altri suggerimenti
Un altro modo per farlo è verificare se l'immagine è già caricata con image.complete
. Ad esempio:
var img = new Image();
img.src = 'foo.jpg';
if(img.complete){
img.onload = function(){ /* ... */ };
} else {
/* execute something else, or the same. */
}
Ho riscontrato questo comportamento in IE6 e 7.