2011-01-03 5 views
11

jQuery sitesinden kopyalanan bu kodu denedim, ancak IE7/IE8'de başarısız oluyor, ancak diğer tarayıcılarda çalışıyor. Bu kodun nesi yanlış, jQuery sitesinden (http://api.jquery.com/error/). JQuery sürüm 1.4.4 kullanıyorum.jQuery'yi kullanarak IE'deki bozuk görüntüleri nasıl gizlerim?

$(document).ready(function(){ 
    $("img").error(function(){ 
    $(this).hide();  
    });  
}); 
+0

herhangi bir hata veriyor mu? – Vivek

+0

Hata göremiyorum. – newbie

cevap

13

sorun yükleme/hata olayları artık tetiklenir olmayacak böylece $(document.ready) yürütüldüğünde zaman, görüntü zaten yüklenmesi tamamlandıktan olmasıdır. Bunu atlamak için aklınıza gelebilecek

tek yolu görüntüsünü, böylece "kuvvet" olayı tetiklenecek yeniden geçerli:

$(document).ready(function(){ 
    $("img").each(function(index) { 
     $(this).error(function() { 
      $(this).hide();  
     }); 
     $(this).attr("src", $(this).attr("src")); 
    });  
}); 

Bu görüntüler olarak performans üzerinde çok kötü olmamalı olacak büyük olasılıkla önbellekten alınacak, sunucudan gerçekten yüklenemedi. (Serin kedilerle;)

Canlı test durumu) burada mevcuttur: hala 'kırık görüntü simgesi' kısa bir görünüme neden olur Yukarıdaki çözüm kullanarak http://jsfiddle.net/yahavbr/QvnBC/1/

+0

Thanx işe yaradı! IE'de – newbie

+1

, bir img öğesinde error() kullanırken, görüntünün src değerini belirlemeden önce hata işleyicisini bağlamanız veya doğru şekilde tetiklenmemesi gerekir. –

+2

clean code love it <3 –

0

, error() ve hide() arasında bir gecikme olduğundan .

Resim başarıyla yüklendiğinde geri arama yapılmasına izin veren jQuery imagesloaded plugin numaralı telefonu kullandım. Önce görüntüyü visibility:hidden olarak ayarlıyorum.

$('div.target img').each(function(){ 
    $(this).imagesLoaded(function(){ 
    $(this).css('visibility','visible'); 
    }) 
}) 

Bu biraz daha kaynak kullanır ama hiç gösterilmesini 'kırık görüntü simgesi' önleyecektir: başarıyla yüklediğinde Sonra visible olarak ayarlayın. Bu site çapında kullanmıyorum, ancak sadece bozuk görüntünün mümkün olduğu bölümler.

0

IE8'deki durumumda, yedek resmim hala yüklenmiyordu. Aşağıdaki kod benim için bunu düzeltdi. Neyin en iyi sonuç verdiğini öğrenmek için zaman aşımı gecikmesi ile oynamanız gerekebilir.

setTimeout(function() { 
    $("img").each(function() { 
     $(this).error(function() { 
      $(this).attr("src", "../imageupload/image-failed.png"); 
     }); 
     $(this).attr("src", $(this).attr("src")); 
    }); 
}, 100);