Wie führe ich nach erfolgreichem Laden eines Bildes einen JavaScript-Rückruf aus?

Bildladen und JavaScript-Rückrufe

Frage: Wie kann ich nach dem erfolgreichen Laden eines Bildes einen JavaScript-Rückruf ausführen? Gibt es alternativ eine Möglichkeit, diese Aufgabe zu erfüllen?

Antwort:

Es gibt verschiedene Methoden, um Rückrufe zum Laden von Bildern in JavaScript zu erreichen. Ein Ansatz beinhaltet die Verwendung der .complete-Eigenschaft und einer Rückruffunktion, wie unten gezeigt:

JavaScript-Code:

var img = document.querySelector('img')

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

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

Dieser Ansatz ist standardkonform, nicht jedoch erfordert externe Abhängigkeiten und führt nicht zu unnötigen Verzögerungen. Die Eigenschaft img.complete wird zunächst überprüft. Wenn das Bild bereits geladen ist, wird der Rückruf sofort ausgeführt. Wenn das Bild nicht geladen ist, werden den Ereignissen „load“ und „error“ Ereignis-Listener hinzugefügt, um sicherzustellen, dass der Rückruf ordnungsgemäß ausgeführt wird.

Das obige ist der detaillierte Inhalt vonWie führe ich nach erfolgreichem Laden eines Bildes einen JavaScript-Rückruf aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!