[Erledigt] Bild tauschen mit if Abfrage

StefanM_ · 31.12.2011, 13:23

Hallo,

Ich habe gerade ein kleines Verständnisproblem beim Bildtausch mit if-Abfrage. Kann mir jemand auf die Sprünge helfen?

PHP-Code:

  swap01b = new Image();

if (swap01b.src == "images/rating0.gif")

{ swap01b.src = "images/rating1.gif"; }

else { swap01b.src = "images/rating0.gif"; }

 
function Wechseln(Bildname,swapname)

{

document.images[Bildname].src = eval(swapname + ".src")

}

 
<img name="foto1" src="images/rating0.gif" OnMouseover = "Wechseln('foto1','swap01b')">

Leider wird das Bild nicht so getauscht wie ich mir das vorstelle. Sieht jemand den Fehler?

jspit · 02.01.2012, 08:40

"den Fehler" ? Ich sehe kaum etwas mit Sinn. Hast du über die Zeilen mal nachgedacht, bevor du sie hier reingestellt hast? (Oder war die Feier schon im Gange ?)
Beispiel: du erzeugst swap01b neu und fragst eine Zeile später eine Eigenschaft ab?
In deiner function Wechseln ist das eval ist völlig unsinnig.

Mein Tipp: Es gibt genug gute scripte als Vorlage, such dir was vernünftiges.
Wenn du nur üben möchtest, bau dir alerts ein oder benutze einen Debugger.

StefanM_ · 02.01.2012, 16:30

Hallo!

Danke für deine Antwort.
Leider kann ich JavaScript nicht und versuch es auch soweit wie möglich zu vermeiden bzw. auf Vorlagen (wie auch hier) zurückzugreifen.
Alles bis auf das if/else stammt auch aus der Vorlage.

Ohne der if/else tut das Script auch genau was es soll, nämlich ein Foto durch das andere ersetzen. Alles was ich erreichen will ist, dass entweder rating0 oder rating1 eingesetzt wird, je nachdem was zum gegeben Zeitpunkt vorhanden ist.

jspit · 02.01.2012, 17:18

Zitat:

Zitat von StefanM_

Hallo!
Ohne der if/else tut das Script auch genau was es soll, nämlich ein Foto durch das andere ersetzen.

Und genau das glaube ich nicht, jedenfalls nicht mit dem hier gezeigten Code.
Die if-Abfrage mußt du mit in deine function nehmen, in etwa so:

Code:

function wechseln(Bildname)
{
  var currPicture=document.images[Bildname].src;
  if(currPicture.indexOf("rating0") > 0) currPicture="images/rating1.gif";
  else currPicture="images/rating0.gif";
  document.images[Bildname].src = currPicture;
}

Im Aufruf werden die Bildnamen für dieses einfache Beispiel nicht benötigt:

Code:

<img name="foto1" src="images/rating0.gif" onmouseover = "wechseln('foto1')">

Das geht alles noch eleganter,ich wollte aber nahe an deinem Code bleiben.
Übernimm es nicht nur, versuche es zu verstehen.

StefanM_ · 02.01.2012, 18:41

Hallo,

Vielen Dank für deine Hilfestellung.
So ist das ganze zur Zeit im Einsatz:

PHP-Code:

  <script type="text/javascript" language="JavaScript">
swap01b = new Image();
swap01b.src = "http://www.php.de/images/rating1.gif";


function Wechseln(Bildname,swapname)
{
document.images[Bildname].src = eval(swapname + ".src")
}
</script>
</head>
<body>
<img name="foto1" src="http://www.php.de/images/rating0.gif" OnMouseover = "Wechseln('foto1','swap01b')">
</body>
</head>

(gekürzt)

Das funktioniert. Ich werde mich an deine Variante herantasten.

rudygotya · 03.01.2012, 08:15

Zitat:

In deiner function Wechseln ist das eval ist völlig unsinnig.

tr0y · 03.01.2012, 08:45

Da offensichtlich eine Art Rating-Bar oder eine "Sternen"-Kette dort manipuliert werden soll, stellt sich für mich die Frage wozu überhaupt dort erst ein Bild erstellen ( methodisch ), also im nachhinein etwas laden, das du dann irgendwo "anpappst". Lad doch einfach den Ausgangzustand als Sprite auf ein Div ( oder anderes Blockobjekt das dir zusagt ) und wechsel bei Mouseover einfach die Sprite-Koordinaten oder gar die CSS-Klasse die den Background wechselt. Ein Vorteil wäre das du Bilddaten nicht erst erzeugend nachlädst sondern einfach nur geladenes darstellst.

jspit · 03.01.2012, 09:00

StefanM übergibt keinen Namen wie es der Parameter swapname vermuten lassen würde,
sondern ein object. Er könnte das auch ohne eval so notieren:

Code:

document.images[Bildname].src = swapname.src;

Hier wird die ganze Umständlichkeit der "Lösung" sichtbar.

Edit: Das Ziel von StefanM ist für mich nicht sichtbar.
@StefanM: wenn du Informationen über dein eigentliches Ziel lieferst, kann dir hier besser geholfen werden.
Ich fürchte, sonst kommt nur Murx raus.

StefanM_ · 03.01.2012, 18:00

Hallo,

Also das Ziel ist wie vermutet eine Rating Bar - also 5 Sterne die bei Mouseover befüllt werden, bzw. wenn gefüllt wieder geleert werden.

Das füllen bzw. leeren habe ich derzeit auch noch recht umständlich über eine if anweisung gelöst. Also Wenn die Mouse über bild5 steht, dann wird Bild1,2,3,4,5 gefüllt - sind die Sterne gefüllt werden die Sterne hinter der Maus geleert.

Das ganze Versuche ich noch in einer Schleife zu lösen - wenn ich dabei Probleme habe melde ich mich wieder.

Ja ich weiß - es gibt eine Menge fertiger Ratingscripts. Aber ich möchte ja auch ein bisschen was lernen dabei.

StefanM_ · 03.01.2012, 19:00

Anbei meine ganze Funktion die zum Glück genau das macht was sie soll:

PHP-Code:

  function wechseln(Bildname)
{
  var bildid = document.images[Bildname].name;
  var id = bildid[4];
  var currPicture=document.images[Bildname].src;
  if(currPicture.indexOf("rating0") > 0)
  {
         currPicture="images/rating1.gif";
         for (i = 1; i <= id; i++)
         {
           var bild = "foto"+i;
           document.images[bild].src = currPicture;
         }
  }
  else
  {
         currPicture="images/rating0.gif";
         for (i = 5; i > id; i--)
         {
           var bild = "foto"+i;
           document.images[bild].src = currPicture;
         }
  }

}

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
[Erledigt] Abfrage für durchschnittliche Bewertung und Anzahl der Kommentare	Karottenkopf51	Datenbanken	14	26.07.2011 10:58
[Erledigt] Bild macht Tabellenzeile höher als das Bild hoch ist	I-Spy	HTML, Usability und Barrierefreiheit	2	24.03.2011 10:59
Problem mit Abfrage - join, inner join, distinct?	Gachet01	Datenbanken	2	27.01.2011 06:49
Im Imagemap Bild tauschen UND Text in sep. div zeigen	needful	HTML, Usability und Barrierefreiheit	6	22.11.2010 08:36
[Erledigt] Bild ausgeben solange das Script läuft	favo	PHP-Fortgeschrittene	6	17.09.2010 13:34
[Erledigt] Bild erstellen, speichern und gespeichertes Bild anzeigen	Garog	PHP Tipps 2009	26	11.07.2010 18:01
daten und bild in die DB und ausgeben	Crimson007	PHP Tipps 2010	16	14.04.2010 00:00
[GELÖST] Bild in die Datenbank einspielen	Timmbow	Datenbanken	15	16.01.2010 19:45
[Erledigt] bild wird nicht gespeichert, finde fehler nicht	Kay654	PHP Tipps 2009	4	24.12.2009 07:52
Bildeffekte berechnen (Bild in den Hintergrund anschregen)	Frank	PHP-Fortgeschrittene	2	28.11.2009 02:20
Bild in enuem Fenster öffnen?	K3HLIM	JavaScript, Ajax und mehr	6	10.04.2009 20:43
[Erledigt] Datenbank abfrage geordnet anzeigen	Octavian	PHP Tipps 2009	10	22.03.2009 15:39
SQL Abfrage "beliebteste User"	freakymiky	Datenbanken	10	12.02.2009 15:56
[Erledigt] Bild auf Bild anzeigen bei x/y	Screeze	JavaScript, Ajax und mehr	2	19.01.2009 19:40
[Erledigt] IF() abfrage in variable packen		PHP Tipps 2005	14	01.04.2005 17:23

31.12.2011, 13:23
StefanM_ Benutzer Registriert seit: 06.12.2011 Beiträge: 34 PHP-Kenntnisse: Anfänger	[Erledigt] Bild tauschen mit if Abfrage Hallo, Ich habe gerade ein kleines Verständnisproblem beim Bildtausch mit if-Abfrage. Kann mir jemand auf die Sprünge helfen? PHP-Code: `swap01b = new Image(); if (swap01b.src == "images/rating0.gif") { swap01b.src = "images/rating1.gif"; } else { swap01b.src = "images/rating0.gif"; } function Wechseln(Bildname,swapname) { document.images[Bildname].src = eval(swapname + ".src") } <img name="foto1" src="images/rating0.gif" OnMouseover = "Wechseln('foto1','swap01b')">` Leider wird das Bild nicht so getauscht wie ich mir das vorstelle. Sieht jemand den Fehler?


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

02.01.2012, 08:40
jspit Erfahrener Benutzer Registriert seit: 19.08.2011 Beiträge: 701 PHP-Kenntnisse: Anfänger	"den Fehler" ? Ich sehe kaum etwas mit Sinn. Hast du über die Zeilen mal nachgedacht, bevor du sie hier reingestellt hast? (Oder war die Feier schon im Gange ?) Beispiel: du erzeugst swap01b neu und fragst eine Zeile später eine Eigenschaft ab? In deiner function Wechseln ist das eval ist völlig unsinnig. Mein Tipp: Es gibt genug gute scripte als Vorlage, such dir was vernünftiges. Wenn du nur üben möchtest, bau dir alerts ein oder benutze einen Debugger.

02.01.2012, 16:30
StefanM_ Benutzer Registriert seit: 06.12.2011 Beiträge: 34 PHP-Kenntnisse: Anfänger	Hallo! Danke für deine Antwort. Leider kann ich JavaScript nicht und versuch es auch soweit wie möglich zu vermeiden bzw. auf Vorlagen (wie auch hier) zurückzugreifen. Alles bis auf das if/else stammt auch aus der Vorlage. Ohne der if/else tut das Script auch genau was es soll, nämlich ein Foto durch das andere ersetzen. Alles was ich erreichen will ist, dass entweder rating0 oder rating1 eingesetzt wird, je nachdem was zum gegeben Zeitpunkt vorhanden ist.

02.01.2012, 18:41
StefanM_ Benutzer Registriert seit: 06.12.2011 Beiträge: 34 PHP-Kenntnisse: Anfänger	Hallo, Vielen Dank für deine Hilfestellung. So ist das ganze zur Zeit im Einsatz: PHP-Code: `<script type="text/javascript" language="JavaScript"> swap01b = new Image(); swap01b.src = "http://www.php.de/images/rating1.gif"; function Wechseln(Bildname,swapname) { document.images[Bildname].src = eval(swapname + ".src") } </script> </head> <body> <img name="foto1" src="http://www.php.de/images/rating0.gif" OnMouseover = "Wechseln('foto1','swap01b')"> </body> </head>` (gekürzt) Das funktioniert. Ich werde mich an deine Variante herantasten.

03.01.2012, 08:45
tr0y Erfahrener Benutzer Registriert seit: 26.07.2010 Beiträge: 4.865 PHP-Kenntnisse: Fortgeschritten	Da offensichtlich eine Art Rating-Bar oder eine "Sternen"-Kette dort manipuliert werden soll, stellt sich für mich die Frage wozu überhaupt dort erst ein Bild erstellen ( methodisch ), also im nachhinein etwas laden, das du dann irgendwo "anpappst". Lad doch einfach den Ausgangzustand als Sprite auf ein Div ( oder anderes Blockobjekt das dir zusagt ) und wechsel bei Mouseover einfach die Sprite-Koordinaten oder gar die CSS-Klasse die den Background wechselt. Ein Vorteil wäre das du Bilddaten nicht erst erzeugend nachlädst sondern einfach nur geladenes darstellst. __________________ Lasse mir ohne Anwendung von Gewalt Dinge schenken, Amazon weiß darüber bald mehr.

03.01.2012, 09:00
jspit Erfahrener Benutzer Registriert seit: 19.08.2011 Beiträge: 701 PHP-Kenntnisse: Anfänger	StefanM übergibt keinen Namen wie es der Parameter swapname vermuten lassen würde, sondern ein object. Er könnte das auch ohne eval so notieren: Code: document.images[Bildname].src = swapname.src; Hier wird die ganze Umständlichkeit der "Lösung" sichtbar. Edit: Das Ziel von StefanM ist für mich nicht sichtbar. @StefanM: wenn du Informationen über dein eigentliches Ziel lieferst, kann dir hier besser geholfen werden. Ich fürchte, sonst kommt nur Murx raus. Geändert von jspit (03.01.2012 um 09:10 Uhr).

03.01.2012, 18:00
StefanM_ Benutzer Registriert seit: 06.12.2011 Beiträge: 34 PHP-Kenntnisse: Anfänger	Hallo, Also das Ziel ist wie vermutet eine Rating Bar - also 5 Sterne die bei Mouseover befüllt werden, bzw. wenn gefüllt wieder geleert werden. Das füllen bzw. leeren habe ich derzeit auch noch recht umständlich über eine if anweisung gelöst. Also Wenn die Mouse über bild5 steht, dann wird Bild1,2,3,4,5 gefüllt - sind die Sterne gefüllt werden die Sterne hinter der Maus geleert. Das ganze Versuche ich noch in einer Schleife zu lösen - wenn ich dabei Probleme habe melde ich mich wieder. Ja ich weiß - es gibt eine Menge fertiger Ratingscripts. Aber ich möchte ja auch ein bisschen was lernen dabei.

03.01.2012, 19:00
StefanM_ Benutzer Registriert seit: 06.12.2011 Beiträge: 34 PHP-Kenntnisse: Anfänger	Anbei meine ganze Funktion die zum Glück genau das macht was sie soll: PHP-Code: function wechseln(Bildname) { var bildid = document.images[Bildname].name; var id = bildid[4]; var currPicture=document.images[Bildname].src; if(currPicture.indexOf("rating0") > 0) { currPicture="images/rating1.gif"; for (i = 1; i <= id; i++) { var bild = "foto"+i; document.images[bild].src = currPicture; } } else { currPicture="images/rating0.gif"; for (i = 5; i > id; i--) { var bild = "foto"+i; document.images[bild].src = currPicture; } } }