HTML Frage/Problem

[3V!L]

Hi,

hab da eine Frage bzw. Problem. Will mittels eines RadioButtons ein Bild einfügen.

<p>
    <input type="radio" name="farbe" value="rot" > rot<br>
    <input type="radio" name="farbe" value="gelb"> gelb<br>
    <input type="radio" name="farbe" value="grün"> grün<br>
    <input type="Button" name="Anzeigen" value="Anzeigen" onclick="ampel()">
</p>

Sollen dann jeweils zu jeder Farbe ein Bild sein.

Hoffe mir kann jemand helfen =)

 

[tOWNshIP]

Die ampel()-Funktion in JavaScript würde ich dazu gern mal sehen.

 

[Kasn]

was willst du denn von uns? den code der funktion ampel()?

 

[3V!L]

sry, hab ich ganz vergessen...

function ampel()

{
if (document.test.farbe[0].checked == true)
{
<img src="ampel_rot.JPG"</a>;
}
if (document.test.elements[1].checked) 
{
<img src="ampel_gelb.JPG"</a>;
}
if (document.test.elements[2].checked) 
{
<img src="ampel_grün.JPG"</a>;
}

die funktion ist imprinzip mein Problem...hab keine wirkliche ahnung wie ich das machen soll

 

[tOWNshIP]

Ampel in JS

 

[zed187]

sry, hab ich ganz vergessen...

function ampel()

{
if (document.test.farbe[0].checked == true)
{
<img src="ampel_rot.JPG"</a>;
}
if (document.test.elements[1].checked) 
{
<img src="ampel_gelb.JPG"</a>;
}
if (document.test.elements[2].checked) 
{
<img src="ampel_grün.JPG"</a>;
}

die funktion ist imprinzip mein Problem...hab keine wirkliche ahnung wie ich das machen soll

uff, hast du das gebaut?

probiers ma damit:

<script type="text/javascript">
   function ampel() {
      if (document.getElementById('myInputRed').checked) {
         document.write("<img src='ampel_rot.JPG' />");
      }

      if (document.getElementById('myInputYellow').checked) {
         document.write("<img src='ampel_gelb.JPG' />");
      }

      if (document.getElementById('myInputGreen').checked) {
         document.write("<img src='ampel_grün.JPG' />");
      }
   }
</script>

<form>
    <input type="radio" name="farbe" value="rot" id="myInputRed" /> rot<br />
    <input type="radio" name="farbe" value="gelb" id="myInputYellow" /> gelb<br />
    <input type="radio" name="farbe" value="grün" id="myInputGreen" /> grün<br />
    <input type="button" name="Anzeigen" value="Anzeigen" onclick="ampel()" />
</form>

Im Prinzip ganz einfach...

Das Javascript nimmt bezug auf die ID (getElementById).
Mittels document.write kann ich daraufhin html code ausgeben lassen.
Zusätzlich hab ich die buttons mal nicht in einen absatz gepackt sondern in eine Form^^

Man sollte schon etwas auf html standards achten, auch wenns nur übungssachen sind, sollte man sich nicht an "chaos code" gewöhnen auch wenns funktionieren mag.

Ich hoffe das konnte dir weiterhelfen

 

[3V!L]

Danke zed 187, hast mir sehr geholfen

Sagen wir mal so, hab mir den Code zusammen gesucht...

Jetzt hab ich nur noch das Problem, das die Ampel auf einer anderen Seite angezeigt werden soll und wenn möglich der Status der Ampel gespeichert wird.

 

[zed187]

Da fallen mir spontan zwei Methoden ein:

1. Du schreibst den code für dein formular jeweils nochmal mit document.write vorweg in die einzelnen if abfragen des javascripts.

2. du arbeitest mit framesets.

Auf http://de.selfhtml.org gibts viele infos.

 

[3V!L]

ja kenn die Seite

aber mit framesets bekommst das doch nicht auf einer anderen html-Seite angezeigt?

 

[tOWNshIP]

mit

<a href="" target="_blank">

kannst Du es in einem neuen Fenster/Tab anzeigen lassen. Das ist allerdings nicht xhtml-konform, aber besser als Framesets.