2012-07-30 16 views
6

il mio codice qui sotto (così come qui: http://jsbin.com/oseruc/1) sfoglia le immagini riportate su ogni clic del mouse. Funziona bene su tutti i browser su cui posso testarlo, tranne che per l'ultimo Firefox. Firefox visualizza gli errori come ad esempio: corrotto o troncato in Firefox

 
Image corrupt or truncated: http://upload.wikimedia.org/wikipedia/commons/0/0c/St ._Cristopher-D%C3%BCrer.jpg 
Image corrupt or truncated: http://upload.wikimedia.org/wikipedia/commons/0/0c/St ._Cristopher-D%C3%BCrer.jpg 
Image corrupt or truncated: Rhinoceros.jpg">http://upload.wikimedia.org/wikipedia/commons/b/b9/D%C3%BCrer-_Rhinoceros.jpg 
Image corrupt or truncated: http://upload.wikimedia.org/wikipedia/commons/0/0c/St ._Cristopher-D%C3%BCrer.jpg 
Image corrupt or truncated: Rhinoceros.jpg">http://upload.wikimedia.org/wikipedia/commons/b/b9/D%C3%BCrer-_Rhinoceros.jpg 
Questo succede se clicco troppo veloce. E sì, hanno visto questo bug report: http://code.google.com/p/fbug/issues/detail?id=4291

Tutte le idee perché questo sta accadendo e su come risolvere questo? Perché non posso ignorare questi errori. Interferiscono con la mia funzionalità.

Il mio codice:

 
<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <script type="text/javascript"> 
(function (window) { 
    var frames = [ 
     "http://upload.wikimedia.org/wikipedia/commons/6/65/Duerer_%28Marter_der_zehntausend_Christen%29.jpg", 
     "http://upload.wikimedia.org/wikipedia/commons/0/0c/St._Cristopher-D%C3%BCrer.jpg", 
     "http://upload.wikimedia.org/wikipedia/commons/b/b9/D%C3%BCrer_-_Rhinoceros.jpg" 
    ];
window.onload = function() { var frame_num = 0; var image = document.getElementById("image");
image.onclick = function() { frame_num = (frame_num + 1) % frames.length; image.src = frames[frame_num]; return false; }; }; })(window); </script> </head> <body> <img id="image" src="http://upload.wikimedia.org/wikipedia/commons/6/65/Duerer_%28Marter_der_zehntausend_Christen%29.jpg" style="position:relative"> </body> </html>

+0

Boh su di te, che sta funzionando come previsto per me in FF 5. Alcuni di errore specifico di versione, può essere, niente di sbagliato con il vostro codice. – SexyBeast

+0

@Cupidvogel, grazie. Sto facendo funzionare la versione 14.0.1. Di solito succede se clicco troppo velocemente sulla prima immagine che viene mostrata inizialmente dopo l'aggiornamento della pagina. Dopo che sembra funzionare bene. Apparentemente questo è un bug in firefox ma ho bisogno di capire come aggirarlo. – akonsu

+0

Posso anche riprodurlo. – Pointy

risposta

1

Prova questo:

window.onload = function() { 
    var frame_num = 0; 
    var image = document.getElementById("image"); 
    function load_next_image() { 
     image.onclick = null; 
     frame_num = (frame_num + 1) % frames.length; 
     image.src = frames[frame_num]; 
     return false; 
    }; 
    image.onclick = load_next_image; 
    image.onload = function() { 
     image.onclick = load_next_image; 
    } 
}; 

Ogni volta che si fa clic su un'immagine disabilita temporaneamente il gestore di clic, quindi riattiva quando l'immagine è terminato il caricamento.

6

Questo accade sicuramente quando si richiede un'immagine troppo veloce. L'ho risolto usando setTimeout per vedere se era stata richiesta un'immagine negli ultimi 35 ms. La mia applicazione era leggermente diversa ma potevi fare qualcosa del genere (o semplicemente disattivare il pulsante fino a quando l'immagine non è stata caricata).

3

ho avuto lo stesso identico problema che interessava tutti i browser firefox, chrome e cioè non solo firefox, solo firefox tuttavia mostrava il messaggio di errore "Image corrotto o troncato" nel consol log. il problema si verifica solo quando una richiesta Ajax si verifica troppo velocemente, il che risulta in conflitto tra la funzione beforeSend e la funzione success. questo è il mio codice:

function loadlist(page, maxrows){ 
    var orderby = $('.sortby_active').attr('title'); 
    var category = $('.category_active').attr('title'); 
    $.ajax({ 
     type: 'post', 
     url: 'gallery_pages.php?page=' + page + '&maxrows=' + maxrows + '&orderby=' + orderby + '&category=' + category, 
     beforeSend: function(){ 
      $('#page_loading').show(); 
      $('#container').fadeOut(300); 
     }, 
     success: function(data){ 
      $('#container').html(data); 
      $('#container').stop().animate({'bottom': '0px'}, 100); 
      n = 0; 
      $('#up_arrow').hide(); 
      $('#scrollup').css('cursor', 'default'); 
      if(!$('#down_arrow').is(':visible')){ 
       $('#down_arrow').show(); 
       $('#scrolldown').css('cursor', 'pointer'); 
      } 
      $('#page_loading').hide(); 
      $('#container').fadeIn(700); 
     } 
    }); 
} 

il conflitto nel mio codice è avvenuto tra fadeIn e fadeOut. la dissolvenza prende 300 ms e se la richiesta AJAX avviene più velocemente di 300ms vi mostrerò che i messaggi ei dati di risposta ajax wont essere visualizzati correttamente. la soluzione era di usare ritardo() in funzione successo. Ho ritardato la fadeIn per 310ms per ogni evenienza :)

function loadlist(page, maxrows){ 
    var orderby = $('.sortby_active').attr('title'); 
    var category = $('.category_active').attr('title'); 
    $.ajax({ 
     type: 'post', 
     url: 'gallery_pages.php?page=' + page + '&maxrows=' + maxrows + '&orderby=' + orderby + '&category=' + category, 
     beforeSend: function(){ 
      $('#page_loading').show(); 
      $('#container').fadeOut(300); 
     }, 
     success: function(data){ 
      $('#container').html(data); 
      $('#container').stop().animate({'bottom': '0px'}, 100); 
      n = 0; 
      $('#up_arrow').hide(); 
      $('#scrollup').css('cursor', 'default'); 
      if(!$('#down_arrow').is(':visible')){ 
       $('#down_arrow').show(); 
       $('#scrolldown').css('cursor', 'pointer'); 
      } 
      $('#page_loading').hide(); 
      $('#container')**.delay(310)**.fadeIn(700); 
     } 
    }); 
} 
+1

Non sto facendo nessuna richiesta Ajax e vedo lo stesso messaggio di errore. – thinsoldier

0

So che questo è vecchio, ma per chiunque altro che si imbatte in questo controllo e assicurarsi che il file in realtà non sia danneggiato. Dopo aver esaminato diverse di queste soluzioni, ho chiesto al mio designer di ricreare l'immagine. Una volta caricato, tutto ha iniziato a funzionare come previsto.

Problemi correlati