img 태그 등 onLoad 이벤트 처리 방법

Question

처리 방법 onLoad img 태그 이벤트?

예 :

$ ('img'). onload (function (e) { 
    alert ('image loaded' + $ (this), attr ('src')); 
}) 

은 ...

및 기타 태그 등 스크립트, 링크, 같은에서는 imageLoader처럼

$("img").one('load', function() { 
    // do stuff 
}).each(function() { 
    if(this.complete) $(this).load(); 
}); 

나를 위해 작동하는 것 같다

Answer 1

jQuery callback on image load (even when the image is cached) 캐싱으로주의 사항을 수정해야합니다.

Answer 2

jQuery doc page for .load()에서이 작업을 수행하는 방법에 대한 예가 있습니다.

HTML :

<img src="book.png" alt="Book" id="book" /> 

자바 스크립트 :

$('#book').load(function() { 
    // Handler for .load() called. 
}); 

그리고, 그것도 jQuery를 페이지에 나와 조심하는주의의 무리가 있습니다.

이미지를 사용하면로드 핸들러가 호출되도록하려면 이미지를로드하기 전에로드 핸들러를 설정해야합니다. 코드로 이미지를 구성하는 경우 .src 특성을 설정하기 전에로드 처리기를 설정해야한다는 의미입니다. 일부 브라우저에서는 이미지가 메모리/디스크 캐시에있는 경우 .src을 할당하면 즉시로드되고 이후 .load() 핸들러를 설정하면 너무 늦어서 (이미지가 이미로드 될 것입니다) .load() 처리기가 호출되지 않습니다.

개체가 존재할 때까지 이벤트 처리기를 할당 할 수 없으므로 페이지 HTML에있는 이미지에 대해 jQuery 기반 .load()가 항상 호출되도록하는 방법을 모르겠지만 개체 종료되고 이미로드되었을 수 있습니다. 이전 스타일의 코딩이지만 실제 HTML에서는 onload = xxx가 아닌 jQuery 설정을 사용할 수 있습니다. 물론, 모든 페이지 이미지 (및 기타 리소스)가로드 된시기를 알기 위해 항상 window.onload를 연결할 수 있습니다.

Answer 3

jQuery에는 load 메서드가 있으며 은이 아닙니다. 그리고 코드는 아마도 다음과 같아야합니다.

$ ('img').load(function() { 
    alert('image loaded ' + this.src); 
})