Wie kann ich defekte Bilder durch jQuery oder JavaScript ersetzen?

Defekte Bilder durch jQuery oder JavaScript ersetzen

Webseiten sind oft auf Bilder angewiesen, und es ist wichtig, mit der Situation umzugehen, wenn ein Bild nicht mehr verfügbar ist und ein kaputtes Bild erscheint. In diesem Artikel werden zwei Methoden zur Lösung dieses Problems untersucht: die Verwendung der jQuery-Bibliothek und eine reine JavaScript-Lösung.

jQuery-Ansatz

Obwohl ursprünglich für diese Aufgabe in Betracht gezogen, wurde der jQuery-Ansatz verwendet erwies sich als weniger einfach. Um jQuery für diesen Zweck zu verwenden, müssen Sie Folgendes tun:

• Den Satz von Bildern mithilfe von $() von jQuery abrufen.
• Verwenden Sie die Methode .filter(), um fehlerhafte Bilder zu filtern.
• Defekte Bildquellen mit .attr() ersetzen.

Pure JavaScript-Lösung

Ein alternativer Ansatz mit reinem JavaScript ist einfacher und effizienter. Durch die Behandlung des onError-Ereignisses für das Bild können Sie dessen Quelle neu zuweisen:

function imgError(image) {
    image.onerror = "";
    image.src = "/images/noimage.gif";
    return true;
}

<img src="image.png" onError="imgError(this);" />

Alternativ können Sie dies ohne Funktion implementieren:

<img src="image.png" onError="this.onerror=null;this.src='/images/noimage.gif';" />

Kompatibilität Überlegungen

Es ist wichtig zu beachten, dass die Browserunterstützung für die Fehlerfunktion variieren kann. Einzelheiten zur Kompatibilität finden Sie in der Referenz in der Originalantwort: http://www.quirksmode.org/dom/events/error.html

Das obige ist der detaillierte Inhalt vonWie kann ich defekte Bilder durch jQuery oder JavaScript ersetzen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!