On Error bei Bildern abfangen
Svetlana
- javascript
Hallo zusammen,
ich erhalte eine Webseite, die von einem IT-Programm generiert wird. In dieser Webseite werden Bilder angezeigt. Leider gibt es das Problem das dieses Program den Pfad zu den Bilder generisch erstellt und es kommt hin und wieder vor, dass es mal kein Bild gibt. Dann erscheint so ein rotes x auf einem weissen Hintergrund. Lässt sich per JavaScript irgendwie nach dem Rendern einer Web-Seite prüfen ob alle Bilder geladen wurden? Für den Fall das der generische Link zum Bild ins Leere geht, und ich diese Fehlersymbol sehe möchte ich, dass ein ganz bestimmtes Bild angezeigt wird. Kann man das irgendwie machen? Normalerweise kannte ich es so, dass ich bei Bildern ein "onerror" absetzen kann der dann einfach eine andere Source nimmt, doch wie gesagt habe ich leider keinen Einfluss darauf wie das Programm die Links generiert und was es machen soll wenn mal kein Bild da ist. Bitte helft mir ich suche schon seit gestern und niemand weiss Rat :-(
Viele Grüsse,
Svetlana
Hell-O!
Lässt sich per JavaScript irgendwie nach dem Rendern einer Web-Seite prüfen ob alle Bilder geladen wurden?
Du hast über document.images Zugriff auf alle Bilder im Dokumentenbaum. Das Objekt hat eine Eigenschaft complete, vielleicht hilft diese dir weiter.
Siechfred
Hello Siechfried,
man es also JS abfragen. Geht das auch für alle auf einen Schlag?
Beispielsweise wenn irgendein Bild nicht geladen werden kann, dass er stattdessen ein anderes Bild lädt. Es soll einfach ein allgemeines Gif-Fehlerbild erscheinen wenn mal ein Link ins leere geht. Ich kann zwar HTML aber JavaScript ist für mich Neuland.
Vielen Dank und viele Grüsse,
Svetlana
Hell-O!
Lässt sich per JavaScript irgendwie nach dem Rendern einer Web-Seite prüfen ob alle Bilder geladen wurden?
Du hast über document.images Zugriff auf alle Bilder im Dokumentenbaum. Das Objekt hat eine Eigenschaft complete, vielleicht hilft diese dir weiter.
Siechfred
Hallo,
Geht das auch für alle auf einen Schlag?
Nicht so einfach.
Der error-Event steigt auf im DOM-Elementenbaum (das nennt sich Bubbling). Das heißt, du kannst zentral z.B. am body-Element alle error-Events des ganzen Dokuments behandeln.
function errorhandler (eventobj) {
alert("errorhandler " + this);
if (!eventobj) {
eventobj = window.event
}
// Bringe das Ursprungselement (Zielelement) des Events in Erfahrung
var ursprungselement;
if (eventobj.target) { // W3C-konforme Browser
ursprungselement = eventobj.target;
} else if (e.srcElement) { // MS IE
ursprungselement = eventobj.srcElement;
}
// ursprungselement ist jetzt eine Referenz auf ein img-Elementobjekt (hoffentlich)
ursprungselement.src = "fehler.gif";
}
document.onerror = errorhandler;
Soweit, so gut... Dummerweise funktioniert das nur im Opera. In den anderen Browser scheint der error-Event nicht aufzusteigen. Also kommt man wohl nicht um onerror-Attribut bei jedem img herum.
Mathias
Hell-O!
Geht das auch für alle auf einen Schlag?
Nein, du kannst sie nur in einer Schleife durchlaufen und ihren Ladestatus abfragen, es sei denn, du hättest Zugriff auf den HTML-Code (dem ist ja nicht so, wie du eingangs schriebst). Dann könntest du onerror auf Ladefehler reagieren.
Siechfred
Hallo,
Du hast über document.images Zugriff auf alle Bilder im Dokumentenbaum. Das Objekt hat eine Eigenschaft complete, vielleicht hilft diese dir weiter.
Das Blöde ist, ein Image hat in manchen Browser complete=true, auch wenn die Grafik nicht geladen wurde (weil die Ressource auf dem Server nicht existiert o.ä.).
http://de.selfhtml.org/javascript/objekte/images.htm#complete, Beachten Sie
Mathias