Dieter Raber: Bild durch Klick ersetzen (Wiederholbar)

Beitrag lesen

Hallo D.R.,

Ich würde eine if-Schleife programmieren. Also ungefähr so:

<gebetsmuehle>
  if, else etc. gehoeren zu den Conditional Statements (Bedingungen), nicht zu Loop Statements  (Schleifen).
</gebetsmuehle>

var document.getElementById('Bild') = Bild

Bist du sicher, dass du das so herum wolltest?

if (Bild.src && Bild.src == bild1.jpg){

Grundsaetzlich kann man sowas natuerlich mit if und else loesen, aber dann brauchst du einen Bedingungsblock pro Bild
Viel einfacher waere es doch zu sagen:

Vorausgesetzt alle Bilder heissen 'bild123.jpg', wobei 123 ein Zaehler sein soll, koennte man sagen
<img src=..... onclick="bildwechsel(this)" />

function bildwechsel(sender)
{
  // Ich mache das hier zum besseren Verstaendnis in kleinen Schritten
  // Das Bild im Beispiel ist Bild5.jpg

// Bildsnamen rausfinden
   // a. src in array splitten
  var bildNameArray = sender.src.split('/');
   // b. letztes Element aus dem Array auslesen (bildName ist danach 'Bild5.jpg'
  var bildName = bildNameArray.pop();

// die laufende Nummer rausfinden
  bildName = bildName.replace(/Bild/, '') // bildName ist jetzt '5.jpg'
  var bildNummer = parseInt(bildName)     // enthaelt jetzt '5'
  var neueNummer = bildNummer + 1         // enthaelt jetzt '6'
  var neuerName  = 'bild' + bildNummer.toString() + '.jpg'  // enthaelt jetzt 'bild6.jpg'
  var neueSrc    = sender.src.replace(bildName, neuerName)  // ist jetzt 'http://...../bild6.jpg'

sender.src     = neueSrc
}

Das war jetzt alles etwas umstaendlich, aber hoffentlich verstaendlich. Was fehlt ist zB. ein Schwellwert, d.h. die hoechste Bildnummer. Dann koennte man beispielsweise sagen
if(neueNummer >= vorgegebenerSchwellwert)
{
  neueNummer = 1;
}

Man koennte ein Directorylisting im Bilderverzeichnis machen, daraus ein Javascript-Array und sich dann darauf beziehen, da sind etliche Sachen machbar.

Gruß,

Dieter