Was ist der beste Weg, um ein lokales Fallback-Image einzurichten, wenn das externe Image nicht geladen wird oder das Laden zu lange dauert.
Fallback-Image und Timeout – Externer Inhalt. Javascript
Craig Stuntz
Sie können eine hinzufügen onerror
Handler:
<img
src="http://example.com/somejpg.jpg"
onerror="this.onerror = null; this.src="./oops.gif""
/>
Hinweis: Einstellung onerror
im Handler auf null setzen, damit die Webseite nicht abstürzt, wenn oops.gif
kann aus irgendeinem Grund nicht geladen werden.
-
Oh, ich habe onerror vergessen. Dies könnte einfacher sein, aber die Lösung, die ich unten gepostet habe, ermöglicht es, die Bilder vorab zwischenzuspeichern und ihre Verfügbarkeit zu überprüfen, bevor sie angezeigt werden müssen. Kommt drauf an was du brauchst…
– moxn
19. Oktober 2009 um 14:23 Uhr
-
Genial! Ich liebe es, wenn ich neue Tricks wie diesen lerne. Ich wollte auf etwas jQuery-Jiggery-Pokery zurückgreifen.
– MikeMurko
25. Februar 2012 um 18:51 Uhr
-
Das Problem hierbei ist der Zeitpunkt, zu dem das Bild als nicht verfügbar angesehen wird! Es kann lange dauern, bis das Laden der Browseraktivität funktioniert, bis es aufgerufen wird
onerror
Veranstaltung.– SaidbakR
31. Dezember 2015 um 17:25 Uhr
-
Ich danke dir sehr. es ist sehr fantastisch
– Albaz
5. November 2019 um 10:06 Uhr
Versuchen Sie, die Eigenschaft Image.complete zu verwenden.
var img = new Image(w,h)
img.src = "http://...";
Überprüfen Sie jetzt regelmäßig, ob img.complete
wahr ist, und nennen Sie einen Fallback-Mechanismus, sollte es immer noch so sein false
nach n Sekunden.
Brillant! Ich wollte gerade dieselbe Frage stellen, und ich habe eine schnelle Google-Suche durchgeführt und diese Frage gefunden. Ich dachte daran, es serverseitig zu machen, aber die Clientseite klingt viel einfacher.
– Geschicklichkeitsdrick
14. Januar 2010 um 12:18 Uhr