Geladene Grafik erneut laden lassen

[Skeeve]

Moin!

Ich bastel mir gerade eine Preview Funktion in HTML/CSS/JavaScript für das Menüsystem meines Festplattenrecorders zusammen. Dafür kann man "Skins" erstellen bei denen mehrere Grafiken kombiniert werden. Um nicht jedesmal am Livesystem die Bilder austauschen zu müssen und alle Kombinationen durchspielen zu müssen, habe ich begonnen mir HTML/CSS Seiten zu erstellen, die bereits alle Bilder passend kombiniert haben.

Nun liegt es in der Natur der Sache, daß Grafiken verändert werden. Jetzt wäre es schön, ich könnte JavaScript auf Knopfdruck dazu veranlassen, alle Grafiken vom lokalen Filesystem neu zu laden.

Meine erste Idee war das hier:

  
function reload_images() {  
 var all_images= document.getElementsByTagName('IMG');  
 var old_src= new Array();  
 for (i=all_images.length; i--;) {  
  with (all_images[i]) {  
   old_src[i]= src;  
   src= '';  
   // hier also src löschen  
  }  
 }  
 for (i=all_images.length; i--;) {  
  with (all_images[i]) {  
   src= old_src[i];  
   // und wieder zurücksetzen  
  }  
 }  
}  

Klappt so aber nicht :-( Es verändert sich nüschts.
-- Skeeve

[Skeeve]

Ich glaube, es hat sich erledigt. setTimeout scheint mein Freund zu sein:

  
function reload_images() {  
 var all_images= document.getElementsByTagName('IMG');  
 var old_src= new Array();  
 for (i=all_images.length; i--;) {  
  with (all_images[i]) {  
   old_src[i]= src;  
   src= 'mt.gif';  
  }  
 }  
 window.setTimeout( function () {  
  for (i=all_images.length; i--;) {  
   with (all_images[i]) {  
    src= old_src[i];  
   }  
  }  
 }, 500);  
}  

[Skeeve]

Doch nicht :-( Die Bilder verschwinden zwar kurz, aber nicht die neuen, sondern die alten erscheinen.

[ChrisB]

Hi,

Nun liegt es in der Natur der Sache, daß Grafiken verändert werden. Jetzt wäre es schön, ich könnte JavaScript auf Knopfdruck dazu veranlassen, alle Grafiken vom lokalen Filesystem neu zu laden.

Warum laedst du nicht einfach das gesamte Dokument im Browser neu?

Meine erste Idee war das hier: [...]
Klappt so aber nicht :-( Es verändert sich nüschts.

Greife doch einfach zu dem altbekannten Trick, einen URL-Parameter an den Grafiknamen anzuhaengen - bspw. den aktuellen Timestamp.
Da du ja sowieso nur lokal arbeitest, kann das auch kaum negative Auswirkungen habenb, ueber die man sich beim Einsatz im WWW wohl eher Gedanken machen muesste.

MfG ChrisB

[Skeeve]

Moin!

Warum laedst du nicht einfach das gesamte Dokument im Browser neu?

Weil verschiedene JavaScript Funktionen schon in die Seite eingegriffen haben können. Lade ich sie komplett neu, wäre das alles verloren.

Greife doch einfach zu dem altbekannten Trick, einen URL-Parameter an den
Grafiknamen anzuhaengen - bspw. den aktuellen Timestamp.

Manchmal muß jemand kommen und einen mit der Nase drauf stoßen! Danke!

  
   function reload_images() {  
    var all_images= document.getElementsByTagName('IMG');  
    for (i=all_images.length; i--;) {  
     with (all_images[i]) {  
      src= src.replace(/(\?ts=\d+)?$/,'?ts='+(1*new Date()));  
     }  
    }  
   }  
  

-- Skeeve