Comment exécuter un rappel JavaScript après un chargement réussi de l'image ?

Chargement d'image et rappels JavaScript

Question : Comment puis-je exécuter un rappel JavaScript lors du chargement réussi d'une image ? Alternativement, existe-t-il un moyen d'accomplir cette tâche ?

Réponse :

Il existe différentes méthodes pour réaliser des rappels de chargement d'images en JavaScript. Une approche consiste à utiliser la propriété .complete et une fonction de rappel, comme démontré ci-dessous :

Code JavaScript :

var img = document.querySelector('img')

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

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

Cette approche est conforme aux normes, ne nécessitent des dépendances externes et n’introduisent pas de retards inutiles. La propriété img.complete est vérifiée initialement, et si l'image est déjà chargée, le rappel est exécuté immédiatement. Si l'image n'est pas chargée, des écouteurs d'événements sont ajoutés aux événements « load » et « error », garantissant que le rappel est exécuté correctement.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!