[JavaScript] onchange

Dieses Thema im Forum "Webentwicklung" wurde erstellt von nohoff, 10. März 2007 .

Schlagworte:
  1. 10. März 2007
    onchange

    Also ich möchte dass sobald in der ersten select auswahl etwas geändert wird die entsprechende 2te Auswahl unten drunter angezeigt wird.
    Für jede Auswahl soll darunter dann die entsprechende 2te Auswahl erscheinen.



    HTML:
    <select name="class" size="10" >
 <option>Consumable</option>
 <option>Behälter</option>
 <option>Waffe</option>
 <option>Rüstung</option>
 <option>Reagenz</option>
 <option>Munition</option>
 <option>Handwerksware</option>
 <option>Rezept</option>
 <option>Köcher</option>
 <option>Questitem</option>
 <option>Schlüssel</option>
 <option>anderes</option>
 </select>
    bin hier am grübeln da ich kein bisschen Javascript kann wie ich das mache /vllt mit onchange)
    Aber wie kann ich dann sagen was für eine Auswahl dann unten kommt ?
     
    + Multi-Zitat Zitieren
  3. 10. März 2007
    AW: onchange

    wie wat? sowat:
    HTML:
    <html><head>

<style type="text/css">
 select#bleh, select#blah {
 display: none;
 }
</style>

<script language="JavaScript">
 function select_change(value) {
 var obj = document.getElementById(value);
 var bleh = document.getElementById("bleh");
 var blah = document.getElementById("blah");
 if(obj) {
 if(value=="bleh") {
 bleh.style.display = "block";
 blah.style.display = "none";
 } else if(value=="blah") {
 bleh.style.display = "none";
 blah.style.display = "block";
 }
 } 
 } 
</script>

<body>
 
 <select id="blubb" size="1" onchange="select_change(this.value);">
 <option selected>----</option>
 <option>bleh</option>
 <option>blah</option>
 </select>
 <select id="bleh" size="1">
 <option>hihi</option>
 <option>haha</option>
 </select>
 <select id="blah" size="1">
 <option>muh</option>
 <option>meh</option>
 </select>
 
</body></html>
    ?
     
    + Multi-Zitat Zitieren
  4. 10. März 2007
    AW: onchange

    genau sowas
    das ist perfekt


    /edit: nur scheint es nicht ganz zu funzen

    HTML:
    <style type="text/css">
 select#subclass0, select#subclass2 {
 display: none;
 }
</style>
<script language="JavaScript">
 function select_change(value) {
 var obj = document.getElementById(value);
 var subclass0 = document.getElementById("subclass_0");
 var subclass2 = document.getElementById("subclass_2");
 if(obj) {
 if(value=="Consumable") {
 subclass0.style.display = "block";
 subclass2.style.display = "none";
 } else if(value=="Waffe") {
 subclass0.style.display = "none";
 subclass2.display = "block";
 }
 } 
 } 
</script>

 
<select id="class" name="class" size="1" onchange="select_change(this.value);">
 <option>Consumable</option>
 <option>Behälter</option>
 <option>Waffe</option>
 <option>Rüstung</option> 
 <option>Reagenz</option>
 <option>Munition</option>
 <Option>Handwerksware</option>
 <option>Rezept</option>
 <option>Köcher</option>
 <option>Questitem</option>
 <option>Schlüssel</option>
 <option>anderes</option>
 </select>
</p>
<p>
<select id="subclass0"name="subclass0" size="1">
 ...
</select>
</p> 
<p>
<select id="subclass2" name="subclass2" size"1">
 ...
</select>
    so noch mal edit : jetzt zeigt er keins von beiden an und wenn ich eine von den beiden optionen auswähle kommt auch nix
     
    + Multi-Zitat Zitieren
  5. 11. März 2007
    AW: onchange

    beuntzt du firefox? für sowas ist extras -> fehlerkonsole immer gut.

    Code:
     var subclass0 = document.getElementById("subclass_0");
    Code:
    <select id="subclass0"name="subclass0" size="1">
    fällt dir was auf?
     
    + Multi-Zitat Zitieren
  6. 11. März 2007
    AW: onchange

    joar ausgebessert und macht trotzdem nix das schlimme is dass der firefox ned viel ausspuckt

    hatte vorher vergessen den ganze selects die ID zuzuweisen das wurde mir auch ned in der fehlerkonsole angezeigt


    HTML:
    <html>
<head>
<style type="text/css">
 select#subclass0, select#subclass2 {
 display: none;
 }
 

</style>
<script language="JavaScript">
 function select_change(value) {
 var obj = document.getElementById(value);
 var bleh = document.getElementById("subclass0");
 var blah = document.getElementById("subclass2");
 if(obj) {
 if(value=="0") {
 subclass0.style.display = "block";
 subclass2.style.display = "none";
 } else if(value=="2") {
 subclass0.style.display = "none";
 subclass2.style.display = "block";
 }
 } 
 } 
</script>
<title>Itemcreator for Mangos</title>
</head>
<body>
<form action="itemcreator.php" method="post">
<p>Item ID:<br><input name="entry" type="text" size="30" maxlength="255"></p>
Itemart
<p>
 <select id="class" name="class" size="1" onchange="select_change(this.value);">
 <option value="90" selected>----</option>
 <option value="0">Consumable</option>
 <option value="1">Behälter</option>
 <option value="2">Waffe</option>
 <option value="4">Rüstung</option> 
 <option value="5">Reagenz</option>
 <option value="6">Munition</option>
 <Option value="7">Handwerksware</option>
 <option value="9">Rezept</option>
 <option value="11">Köcher</option>
 <option value="12">Questitem</option>
 <option value="13">Schlüssel</option>
 <option value="15">anderes</option>
 </select>
</p>
<p>
<select id="subclass0" name="subclass0" size="1">
 <option>Essen</option>
 <option>Trinken</option>
 <option>Trank</option>
 <option>Schriftrolle</option>
 <option>Verband</option>
 <option>Gesundheitsstein</option>
 <option>Kampfeffekt</option>
</select>
</p> 
<p>
<select id="subclass2" name="subclass2" size="1">
 <option>Axt (Einhand)</option>
 <option>Axt (Zweihand)</option>
 <option>Bogen</option>
 <option>Gewehr</option>
 <option>Steitkolben (Einhand)</option>
 <option>Streitkolben (Zweihand)</option>
 <option>Stangenwaffe</option>
 <option>Schwert (Einhand)</option>
 <option>Schwert (Zweihand)</option>
 <option>Stab</option>
 <option>Exotic (Einhand)</option>
 <option>Exotic (Zweihand)</option>
 <option>Faustwaffe</option>
 <option>andere Waffe</option>
 <option>Dolch</option>
 <option>Wurfwaffe</option>
 <option>Speer</option>
 <option>Armbrust</option>
 <option>Zauberstab</option>
 <option>Angel</option>
</select>
     
    + Multi-Zitat Zitieren
  7. 11. März 2007
    AW: onchange

    Code:
     var [b]bleh[/b] = document.getElementById("subclass0");
 var [b]blah[/b] = document.getElementById("subclass2");
    eigentlich sollte die fehlerkonsole ausspucken, dass subclass0 bzw. subclass2 kein oder ein nicht gefundenes objekt ist.
     
    + Multi-Zitat Zitieren
  8. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.

Auf dieses Thema antworten