JavaScript select onChange soll <h2> Element aendern

Julexander · 3. November 2010

Ich hab ein <select> Element mit 3 Optionen in meiner Form, und moechte nun,
wenn der User eine Option waehlt, dass bei einem h2 Element und einem span Element mit einer bestimmten ID der Text geaendert wird.
Ich brauche also fuer jede Option ein if und ich muss die Elemente irgendwie ansprechen. (Ich weiss schon dass das mit document.getElementbyId funktioniert).
Habe leider kA von Javascript, Java verstehe ich.

Danke fuer hilfe!

confector · 3. November 2010

gib doch jedem option-Tag eine onclick funktion. Dann brauchste keine if Abfrage etc

Mr. Snoot · 3. November 2010

Habe vor Jahren mal was ähnliches gebraucht:

PHP:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">

<html>
  <head>
    <title></title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript">
      function wechsel()
      {
        var option  = document.formular.auswahl.selectedIndex;
        var heading = document.getElementById("heading");
        var text    = document.getElementById("text");

        switch (option)
        {
          case 1:
            heading.innerHTML = "alternative Überschrift 1";
            text.innerHTML    = "alternativer Text 1";
            break;
          case 2:
            heading.innerHTML = "alternative Überschrift 2";
            text.innerHTML    = "alternativer Text 2";
            break;
          case 3:
            heading.innerHTML = "alternative Überschrift 3";
            text.innerHTML    = "alternativer Text 3";
            break;
          default:
            heading.innerHTML = "Überschrift";
            text.innerHTML    = "Text";
            break;
        }
      }
    </script>
  </head>

  <body>

    <form name="formular">
      <select name="auswahl" onchange="wechsel()">
        <option value="0">-</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>
    </form>

    <h2 id="heading">Überschrift</h2>

    <span id="text">Text</span>

  </body>

</html>

Suche

JavaScript select onChange soll <h2> Element aendern

Julexander

Lieutenant

confector

Ensign

Mr. Snoot

Gast

Ähnliche Themen