src를 변경하면 jquery callback 이미지가로드됩니다.

Question

json 파일을로드 한 후에 img src를 변경하면 모든 것이 정상적으로 작동합니다. 하지만 이미지가 완전히로드되었는지 확인하려고합니다. 내가 사용 할 수있는 :

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

그러나 이미지가 캐시에있는 경우 모든 브라우저가 부하를 해고 다양한 게시물을 읽은 후

. 이 문제를 일으킬 브라우저에서이 문제가 발생하지 않는 것 같습니다. 하지만 난 단지 FF (6.0.2), 크롬 (13.0.7) 및 사파리 (5.0.5) Mac에서 테스트했습니다. 이제 IE에는 문제가 있어야하며 PC에만 관련된 것입니다. 나는 브라우저의 꽤 최근 버전을 돌리고있다. 아니면 내 다른 생각은 내가 jquery (1.6.3)의 최신 버전을 실행 해요. 변경되었습니다로드?

최신 jquery를 실행하는 것이 좋겠지 만, 그렇지 않다면 이전 브라우저 문제이므로 수정해야합니다. jQuery loading images with complete callback 을 그리고 또한 .load API를 페이지에 의견의 일부 : 나는 예를 들어이 사이트에 솔루션의 몇 가지를 시도했습니다 http://api.jquery.com/load-event/#comment-30211903

을하지만 나는 그들이 일을 얻을 수없는 것. 첫 번째 것은 전혀 작동하지 않고 두 번째 것은 .each()로 넘어지는 것으로 보입니다.

이것은 지금까지 내가 잘 작동하는 것으로 보이는 코드이지만 오래된 브라우저 문제 일 가능성은 확실하지 않습니다.

$.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); 
}) 

미리 도움을 청하십시오.

B는

나는 약 1 년 전에했던 몇 가지 테스트를 기반으로

Answer 1

, 나는 다른 하나 개의 값에서 이미지의 .src을 변경할 때로드 이벤트를 얻기 위해 더 신뢰할 수있는 방법을 찾을 수 없습니다. 따라서 새 이미지를로드하고 새 이미지를로드 할 때 새 이미지로 대체해야했습니다. 이 코드는 약 1 년 동안 수백 개의 웹 사이트 (슬라이드 쇼에서 사용됨)에서 성공적으로 실행되어 이제는 작동하는 것으로 알고 있습니다.

새 이미지에 .src 속성을 설정하기 전에로드 처리기를 설정하면 안정적으로로드 이벤트가 발생합니다. 다음은 오늘로드 이벤트 캡처를 위해 작성한 코드입니다 : jQuery: How to check when all images in an array are loaded?.

하려면 .src (나는 이전 버전의 브라우저를 테스트하지 않았다) 나는 그것을 시도했습니다 현대적인 브라우저에서 나를 위해 작동 설정하기 전에 이벤트 핸들러를 첨부이 코드는

:

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

당신은 그것을 볼 수 있습니다 여기에서 일하십시오 : http://jsfiddle.net/jfriend00/hmP5M/ 그리고 jsFiddle를 사용하여 원하는 브라우저를 테스트 할 수 있습니다. 이미지를 클릭하면 새로운 이미지가로드됩니다. 그것은 세 가지 다른 이미지 (매회 .src 설정)를 순환하며 매번 두 경우를 테스트하기 위해 매번 캐시에서 절대적으로 두 번로드하고 캐시에서 한 번씩로드합니다. .load 핸들러가 호출 될 때마다 msg를 화면에 출력하여 호출되는지 여부를 확인할 수 있습니다. 답장을