gelöst per onchange ein bild ändern.
Hallo Leute,
ich hoffe ihr könnt mir helfen.
http://www.jeatrexs.bplaced.net/filemanager/php/gohg/v2/order.php <-- das is der link.
ich hab ein bestellformular gemacht, und da seht ihr jetzt oben das bild von Counterstrike Source, und oben das <select>-feld wo man das spiel auswählen kann.
So ist jetzt möglich, das bild per onchange funktion zu ändern, wenn man das select feld umändert? also wenn man z.b. Counterstrike 1.6 auswählt, soll dort das bild von Counterstrike 1.6 angezeigt werden und nicht mehr von counterstrike source...
Könnt ihr mir helfen? bin in javascript ne lusche...
Danke (sorry aber gab keine Javascript Kategorie)
ich hoffe ihr könnt mir helfen.
http://www.jeatrexs.bplaced.net/filemanager/php/gohg/v2/order.php <-- das is der link.
ich hab ein bestellformular gemacht, und da seht ihr jetzt oben das bild von Counterstrike Source, und oben das <select>-feld wo man das spiel auswählen kann.
So ist jetzt möglich, das bild per onchange funktion zu ändern, wenn man das select feld umändert? also wenn man z.b. Counterstrike 1.6 auswählt, soll dort das bild von Counterstrike 1.6 angezeigt werden und nicht mehr von counterstrike source...
Könnt ihr mir helfen? bin in javascript ne lusche...
Danke (sorry aber gab keine Javascript Kategorie)
2 Antworten
- LÖSUNG Fritzchen schreibt am 07.07.2008 um 15:13:08 Uhr
- LÖSUNG Guenni schreibt am 07.07.2008 um 20:45:23 Uhr
LÖSUNG 07.07.2008 um 15:13 Uhr
Hallo.
Doch es gibt ein Javascript Kategorie. Unter Programmiersprachen.
Ja theoretisch sollte es vielleicht so gehen.
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function bwechsel(name, value){
var spiel = document.getElementById(name)
if (document.testform.spiel.selectedIndex == 1)
{
document.getElementById("Bild").src = "upload/angler.jpg";
}
else if (document.testform.spiel.selectedIndex == 2)
{
document.getElementById("Bild").src = "upload/angler.jpg";
}
else if (document.testform.spiel.selectedIndex == 3)
{
document.getElementById("Bild").src = "upload/angler.jpg";
}
else{
document.getElementById("Bild").src = "upload/am_tisch.jpg";
}
}
//-->
</SCRIPT>
</head>
<body>
<form name="testform" action="" method="post">
<select name="spiel" onchange="bwechsel()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<img src="upload/am_tisch.jpg" id="Bild"><br>
</form>
Bildnamen und Pfade müßten da natürlich noch angepaßt werden.
Viel Erfolg.
Doch es gibt ein Javascript Kategorie. Unter Programmiersprachen.
Ja theoretisch sollte es vielleicht so gehen.
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function bwechsel(name, value){
var spiel = document.getElementById(name)
if (document.testform.spiel.selectedIndex == 1)
{
document.getElementById("Bild").src = "upload/angler.jpg";
}
else if (document.testform.spiel.selectedIndex == 2)
{
document.getElementById("Bild").src = "upload/angler.jpg";
}
else if (document.testform.spiel.selectedIndex == 3)
{
document.getElementById("Bild").src = "upload/angler.jpg";
}
else{
document.getElementById("Bild").src = "upload/am_tisch.jpg";
}
}
//-->
</SCRIPT>
</head>
<body>
<form name="testform" action="" method="post">
<select name="spiel" onchange="bwechsel()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<img src="upload/am_tisch.jpg" id="Bild"><br>
</form>
Bildnamen und Pfade müßten da natürlich noch angepaßt werden.
Viel Erfolg.
LÖSUNG 07.07.2008 um 20:45 Uhr
Die Lösung kann man noch ein bißchen optimieren, in dem man in der Select-Liste
gleich die Dateinamen der Bilder als Values einträgt.
Dadurch erspart man sich die if-then-else Verschachtelungen in der Funktion.
Gruß
Günni
gleich die Dateinamen der Bilder als Values einträgt.
Dadurch erspart man sich die if-then-else Verschachtelungen in der Funktion.
01.
<html> 02.
<head> 03.
<title>Untitled</title> 04.
<script type="text/javascript"> 05.
<!-- 06.
function bild_wechsel(select){ 07.
document.getElementById("bild").src = select.options[select.options.selectedIndex].value; 08.
return true; 09.
} 10.
// --> 11.
</script> 12.
</head> 13.
<body> 14.
<form action="select-mit-bild.html" method="post" name="testform"> 15.
<img src=" counterstrike-1.6.jpg " height="200" width="250" id="bild"><br> 16.
<select name="selspiel" onchange="bild_wechsel(this)"> 17.
<!-- 18.
Der Value-Eigenschaft wird der Dateiname des anzuzeigenden Bildes zugewiesen. 19.
Der Wert wird in der oben beschriebenen Funktion ausgewertet, und dem img-Tag 20.
als Source zugewiesen. 21.
// --> 22.
<option value="counterstrike-1.6.jpg">Counterstrike 1.6</option> 23.
<option value="quake4.jpg">Quake 4</option> 24.
<option value="doom3.jpg">Doom 3</option> 25.
</select> 26.
</form> 27.
</body> 28.
</html>Günni
Ähnliche Inhalte
Neue Wissensbeiträge
Heiß diskutierte Inhalte
