Fehlende Bilder mit jQuery nachbearbeiten

Hat man mal einen Blog oder eine Webseite ein paar Jahre online, entstehen primär zwei Probleme: 1) Evtl. verlinkte Seiten existieren nicht mehr und 2) evtl. direkt verlinkte Bilder sind auch weg. Letzteres kann sogar dann passieren, wenn man Bilder lokal ablegt, und man aus Versehen mal was löscht. Entweder das eine oder das andere zu finden ist fast unmöglich, außer Kommisar Zufall hilft, oder man verwendet entsprechende Tools zum Scannen der Seite.

Elegant geht zumindest das Problem mit den verschwundenen Bildern über jQuery zu lösen. jQuery4U hat bereits vor einiger Zeit ein spannendes Snippet veröffentlicht:

// Replace source
$('img').error(function(){
        $(this).attr('src', 'missing.png');
});
 
// Or, hide them
$("img").error(function(){
        $(this).hide();
});

Dieses baut auf dem jQuery-Befehl error() auf und ersetzt fehlende Bilder durch einen entsprechenden Platzhalter, bzw. blendet diese weg. In einem neuen Anlauf versucht jQuery4U nun, dass Problem mit Ajax zu lösen. Das Resultat dürfte sicherlich das gleiche sein, die Ajax-Version allerdings auch die sicherere. Das Skript überprüft mittels eines Ajax-Requests, ob das Bild vorhanden ist. Da der Aufruf vom Type HEAD ist, wird wirklich nur die Existenz überprüft, und die Grafik nicht ein zweites mal herunter geladen. Womit wir dann auch beim eigentlichen Problem wären: durch das Skript steigt die Anzahl der Aufrufe für Bilder um das doppelte.

Das halte ich persönlich für einen zu großen Overhead, da in der Regel ja davon auszugehen ist, dass die Website funktioniert, und kaputte Bilder eher eine Ausnahmeentscheidung sein sollten. Insofern gefällt mir das einfache Überprüfen mittels des Befehls error() besser.

Ähnliche Beiträge

AutoSuggest mit jQuery Das Auto-Completing bzw. Ajax-Angetriebene Suchen werden ja im Internet immer beliebter, allerdings haben die Teile bei falscher Programmierung die An...
FireQuery – jQuery für Firebug Zugegebenermaßen ist jQuery ganz nett, auch die Art & Weise, wie es JavaScript anzeigt und bearbeitet ist ganz nett, aber sobald man ein Prototype...
Catch404 – 404 mit jQuery Abfangen 404 sind eine sehr unschöne Sache, vor allem bei einer internen Verlinkung. Hier kann man aber zumindest durch Studieren der Log-Files merken, das etw...
Smint – vernünftiges Menü für Onepage Layout... Onepage-Seiten sind eine sehr feine Sache, vor allem für Portfolios wo es in der Regel eh nicht viel zu sagen gibt außer "kauf mich". Sollte ich jemal...

Schreibe einen Kommentar