>웹 프론트엔드 >JS 튜토리얼 >이미지가 로드된 후 JavaScript 콜백을 어떻게 실행할 수 있나요?

이미지가 로드된 후 JavaScript 콜백을 어떻게 실행할 수 있나요?

Linda Hamilton
Linda Hamilton원래의
2024-12-04 14:31:12742검색

How Can I Run a JavaScript Callback After an Image Loads?

이미지 로드 시 JavaScript 콜백 실행

질문

이미지 로드가 완료되면 콜백 함수를 실행할 수 있는 방법이 있나요?

답변

.complete 사용 콜백

이 방법은 표준을 준수하며 종속성 요구 사항이 낮습니다. 또한 불필요한 지연을 방지합니다.

var img = document.querySelector('img')

function loaded() {
  alert('loaded')
}

if (img.complete) {
  loaded()
} else {
  img.addEventListener('load', loaded)
  img.addEventListener('error', function() {
      alert('error')
  })
}

소스

위 코드 조각은 다음 리소스를 기반으로 합니다.

  • [HTML5 Rocks: 약속](http://www.html5rocks.com/en/tutorials/es6/promises/)

위 내용은 이미지가 로드된 후 JavaScript 콜백을 어떻게 실행할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.