2011-09-16 24 views
14

Bir json dosyası yükledikten sonra img src'yi değiştiriyorum, tüm bunlar iyi çalışıyor. Ama resmin tamamen yüklendiğinden emin olmak istiyorum. Ben kullanarak yapabilirsiniz Hangi: jcery geri çağırma src'yi değiştirirken görüntü yükü

 .one("load",function(){ 
       alert("image has load yay"); 
      }); 

Ama görüntü önbellekteyse tüm tarayıcılar yükü ateş çeşitli mesajları okuduktan sonra

. Bu soruna neden olan tarayıcıda bu sorunu alıyorum görünmüyor. Ancak yalnızca bir Mac’te FF (6.0.2), Chrome (13.0.7) ve Safari’yi (5.0.5) test ediyorum. Şimdi eminim IE'nin bir problemi olmalı ve sadece PC ile ilgili. Tarayıcıların çok yeni sürümlerini çalıştırıyorum, bu yüzden şu anda yangın yükü için bir şeyler değişti. Ya da benim diğer düşüncem en son jQu versiyonunu çalıştırıyorum (1.6.3) .load değiştirilmiş mi?

En son jQueryu çalıştırmakla ilgili her şeyi umuyoruz, ancak değilse ve daha eski bir tarayıcı sorunu varsa o zaman bir düzeltme koymam gerekiyor. jQuery loading images with complete callback Ve ayrıca .Load api sayfasında yorumlar bazı: Ben mesela bu sitede çözümün bir çift denedim http://api.jquery.com/load-event/#comment-30211903

Ama onları işe almak gibi olamaz. İlki hiç işe yaramıyor ve ikincisi .each() ile düşüyor gibi görünüyor.

Şimdiye kadar çalışmış olduğum, ancak daha eski bir tarayıcı sorunu olabileceğinden emin olamadığım kod bu.

$.getJSON(jsonURL, function(json) {   
    $("a.imgZoom img").attr("src", json[imageID].largeImage).one("load",function(){ 
     alert("the image has loaded"); 
    //do something here 
    }); 
$("a.imgZoom").attr("href", json[imageID].largeImage); 
}) 

Yardımlarınız için şimdiden teşekkür ederiz.

B

Ben yaklaşık bir yıl önce yaptığı bazı testlere dayanarak

cevap

34

, ben başka bir değerden bir resmin .src değiştirirken bir yük olayı almak için hiçbir güvenilir bir yol buldum. Bu nedenle, yeni görüntü yüklendiğinde yeni bir görüntü yüklemeye ve yenisiyle değiştirdiğime yer vermek zorunda kaldım. Bu kod, yaklaşık bir yıl boyunca birkaç yüz web sitesinde (bir slayt gösterisi tarafından kullanılıyor) başarılı bir şekilde çalışıyor.

Yükleyici, .src özelliğini yeni bir görüntüde ayarlamadan ÖNCE, yük olayını güvenilir bir şekilde alacaktır. İşte yük olayını yakalamak için bugün daha önce yazdığım bazı kodlar: jQuery: How to check when all images in an array are loaded?.

.src (ı eski tarayıcıları test etmedi) ben bunu denedim modern tarayıcılarda benim için çalışıyor ayarlara ÖNCE olay işleyicisi ekler Bu kod

:

$("img").one("load", function() { 
     // image loaded here 
    }).attr("src", url); 

Görebiliyorsun Burada çalışmak: http://jsfiddle.net/jfriend00/hmP5M/ ve bu jsFiddle kullanarak istediğiniz herhangi bir tarayıcıyı test edebilirsiniz. Yeni bir fotoğraf yüklemek için sadece resmin üzerine tıklayın. Her iki durumu da test etmek için üç farklı görüntüden (her seferinde .src ayarlayarak), bunlardan ikisini (önbellekten asla) ve önbellekten bir tanesini (her seferinde bir kez) yükler. .load işleyicisi her çağrıldığında ekrana bir msg gönderir, böylece arandığını görebilirsiniz.

+0

Cevabınız için teşekkürler,% 100 emin değilim nasıl daha önce onu arayabilirim. Örneğinize bakmak, aşağıdakileri yapmadı: ( – Ben

+0

Çalıştığım gibi görünen bir yanıtı örnek olarak ekledim. – jfriend00

+0

Teşekkürler jfriend00, işe yaradı. Elbette olası sorunları gidermek için .load çalışmanın versiyonu ama bunun için sözünü alacağım. – Ben

İlgili konular