tutorials.de Buch-Aktion 02/2012
ERLEDIGT
JA
ANTWORTEN
2
ZUGRIFFE
885
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 27.08.06 13:18 #1
    tholmer tholmer ist offline Mitglied Silber
    Registriert seit
    Feb 2004
    Ort
    Thalheim
    Beiträge
    76
    Hi,

    ich hab so eigtl. keine Ahung von Javascript, nur PHP. Da ich nun aber doch ein wenig Javascript brauch, hab ich bisschen rumprobiert.

    Der Sachverhalt:
    Ich will in einer Auswahlliste zwischen 3 Optionen wählen, also 0, 1 oder 2 (selectedIndex). Beim auswählen, also bei onChange, soll dann:
    bei 0: nichts passieren bzw DIV mit ID E und C ausgeblendet werden
    bei 1: soll ein DIV mit der ID E eingeblendet und das mit ID C ausgeblendet
    bei 2: soll ein DIV mit der ID C eingeblendet und das mit ID E ausgeblendet

    Also habe ich eine Funktion geschrieben:
    HTML-Code:
    <script type="text/javascript">
        function toogle_type()
        {
          type = document.forms.newoptform.el_type.selectedIndex;
          abschnittE = document.getElementById("E");
          abschnittC = document.getElementById("C");
          
          if ( type == "0" )
          {
            abschnittE.style.display = "none";
            abschnittC.style.display = "none";
          }
          else if ( type == "1" )
          {
            abschnittE.style.display = "block";
            abschnittC.style.display = "none";
          }
          else
          {
            abschnittC.style.display = "block";
            abschnittE.style.display = "none";
          }
              
          return true;
        }
      </script>
    Das onChange Event:
    HTML-Code:
    <select name="el_type" size="1" onChange="toogle_type()">
              <option value="0">Auswahlmöglk.</option>
              <option value="1">Eingabemöglk.</option>
              <option value="2">Auswahlbox</option>
            </select>
    Und die Abschnitt die aus bzw eingebldnet werden sollen:
    HTML-Code:
    <div id="E">
        <tr>
          <td colspan="2" class="row1"><span class="norm">Breite des Eingabefeldes:</span></td>
          <td colspan="4" class="row1"><input type="text" name="el_width" size="5" value="0" /></td>
        </tr>
        <tr>
          <td colspan="2" class="row1"><span class="norm">maximaler Eingabewert durch Kunde:</span></td>
          <td colspan="4" class="row1"><input type="text" name="el_value_max" size="10" value="0" /></td>
        </tr>
        <tr>
          <td colspan="2" class="row1"><span class="norm">minimaler Eingabewert durch Kunde:</span></td>
          <td colspan="4" class="row1"><input type="text" name="el_value_min" size="10" value="0" /></td>
        </tr>
        <tr>
          <td colspan="2" class="row1"><span class="norm">Einheit:</span></td>
          <td colspan="4" class="row1"><input type="text" name="el_unit" size="5" /></td>
        </tr>
        <tr>
          <td colspan="2" class="row1"><span class="norm">Schrittweite:</span></td>
          <td colspan="4" class="row1"><input type="text" name="el_stepwidth" size="10" value="0" /></td>
        </tr>
        </div>
        <div id="C">
        <tr>
          <td colspan="2" class="row1"><span class="norm">wählbare Auswahlmöglichkeiten:</span></td>
          <td colspan="4" class="row1"><input type="text" name="el_units" size="30" /></td>
        </tr>
        </div>
    Aber es passiert nix. Es kommt nicht mein ein Fehler beim IE oder es steht etwas in der Fehlerkonsole von Opera.

    Ich habe durch document.write herausgefunden das er die Funktion aufruft und auch die If Anweisungen richtig umsetzt. Aber er blendet die DIV's nicht aus.

    Kann mir jemand sagen wo der Fehler liegt? Oder weiß vielleicht noch einen eine andere leichtere Methode!?

    mfg, tholmer
     
    www.partygebirge.de - Die Community für Events und Partybilder im Erzgebirge :)
    Zitieren Zitieren
  2. 27.08.06 13:45 #2
    Avatar von Mark
    Mark Mark ist offline Mod | Cinema4D
    tutorials.de Moderator
    Registriert seit
    Aug 2003
    Ort
    Vienna:Austria
    Beiträge
    8.123
    Blog-Einträge
    10
    Hi!

    ...hm, beisst sich da was mit Deinen "tables"?!
    HTML-Code:
    <html>
<head>
<title></title>
 
<script type="text/javascript">
<!--
function toogle_type() {
    type = document.forms.newoptform.el_type.selectedIndex;
    abschnittE = document.getElementById("E");
    abschnittC = document.getElementById("C");
 
    if ( type == "0" ) {
        abschnittE.style.display = "none";
        abschnittC.style.display = "none";
    } else if ( type == "1" ) {
        abschnittE.style.display = "block";
        abschnittC.style.display = "none";
    } else {
        abschnittC.style.display = "block";
        abschnittE.style.display = "none";
    }
    return true;
}
//--> 
</script>
 
</head>
<body>
 
<form name="newoptform">
 
<select name="el_type" size="1" onChange="toogle_type()">
    <option value="0">Auswahlmöglk.</option>
    <option value="1">Eingabemöglk.</option>
    <option value="2">Auswahlbox</option>
</select>
 
<div id="E" style="display:none;">
<table>
<tr><td colspan="2" class="row1"><span class="norm">Breite des Eingabefeldes:</span></td>
    <td colspan="4" class="row1"><input type="text" name="el_width" size="5" value="0" /></td>
</tr>
<tr><td colspan="2" class="row1"><span class="norm">maximaler Eingabewert durch Kunde:</span></td>
    <td colspan="4" class="row1"><input type="text" name="el_value_max" size="10" value="0" /></td>
</tr>
<tr><td colspan="2" class="row1"><span class="norm">minimaler Eingabewert durch Kunde:</span></td>
    <td colspan="4" class="row1"><input type="text" name="el_value_min" size="10" value="0" /></td>
</tr>
<tr><td colspan="2" class="row1"><span class="norm">Einheit:</span></td>
    <td colspan="4" class="row1"><input type="text" name="el_unit" size="5" /></td>
</tr>
<tr><td colspan="2" class="row1"><span class="norm">Schrittweite:</span></td>
    <td colspan="4" class="row1"><input type="text" name="el_stepwidth" size="10" value="0" /></td>
</tr>
</table>
</div>
 
<div id="C" style="display:none;">
<table>
<tr><td colspan="2" class="row1"><span class="norm">wählbare Auswahlmöglichkeiten:</span></td>
    <td colspan="4" class="row1"><input type="text" name="el_units" size="30" /></td>
</tr>
</table>
</div>
 
</form>
 
</body>
</html>
    ...funktioniert bei mir unter IE und MF...

    Liebe Grüße,
    Mark.
     
    ... bitte keine C4D-Fragen per PN ...
    +++ OUT NOW for CINEMA4D:     Al'em - Free Align Plugin + Shaderpack Vol 1 - Free Shaders     + Roll-It v1.0 - Free Roll Plugin + Egg-Objekt - Free Egg Primitive +++
     eggtion.net
    Zitieren Zitieren
  3. 27.08.06 15:01 #3
    tholmer tholmer ist offline Mitglied Silber
    Registriert seit
    Feb 2004
    Ort
    Thalheim
    Beiträge
    76
    Na toll... so einfach wars. Danke dir!
     
    www.partygebirge.de - Die Community für Events und Partybilder im Erzgebirge :)
    Zitieren Zitieren
« H1, H2 in midas formatiert ganzen Absatz, nicht nur die Selektion | Google Maps im Hybrid-Modus starten »

Ähnliche Themen

  1. onchange event
    Von Chewbacca im Forum Javascript & Ajax
    Antworten: 2
    Letzter Beitrag: 01.03.09, 19:33
  2. onchange reagiert nicht auf Änderung per Javascript
    Von heckipateng im Forum Javascript & Ajax
    Antworten: 4
    Letzter Beitrag: 10.11.07, 14:46
  3. onchange reagiert nicht auf Änderung per Javascript
    Von Rambomaster im Forum Javascript & Ajax
    Antworten: 2
    Letzter Beitrag: 18.10.07, 00:27
  4. onChange 2 oder mehrere event
    Von mckani im Forum Javascript & Ajax
    Antworten: 10
    Letzter Beitrag: 10.10.05, 23:26
  5. Bei OnChange-Event Wert setzen
    Von ahykes im Forum Javascript & Ajax
    Antworten: 8
    Letzter Beitrag: 09.11.04, 11:32