JavaScript ein bzw. ausblenden ... code problem

Question

Hey,

kann mir jemand weiterhelfen irgendwie läuft das so nicht wie ich mir das gedacht hab.

<tr>
<td>Betreff</td>
<td><select name="Thema" id="Browser">
<option value="Bitte wählen">Bitte w&auml;hlen sie...</option>
<option value="Werkstattermin">Werkstattermin</option>
<option value="Probefahrt">Probefahrt</option>
<option value="Sonstiges">Sonstiges</option></select>

<script type="text/javascript">
var b=document.getElementById("Browser");
if (b) b.onchange=function() {
var m=document.getElementById("marker");
if (m) m.style.display=(b.value=="Probefahrt")?"block":"none";
}

var b=document.getElementById("Browser");
if (b) b.onchange=function() {
var m=document.getElementById("Kennzeichen");
if (m) m.style.display=(b.value=="Werkstattermin")?"block":"none";
}
</script>

</td>
</tr>

<tr id="marker" style="display:none">
<td>Marke</td>
<td><select name="Marke"><option value="Opel">Opel</option>
<option value="Subaru">Subaru</option>
<option value="Chevrolet">Chevrolet</option>
<option value="Isuzu">Isuzu</option>
<option value="Saab">Saab</option>
<option value="Peugeot">Peugeot</option>
</select></td>
</tr>
<tr id="Kennzeichen" style="display:none">
<td>Kennzeichen</td>
<td><input type="text" name="Kennzeichen"></select></td>
</tr>




why?

Answer 1

was soll passieren, was passiert stattdessen?

Wieso taucht der JavaScript-Code doppelt auf, folgendes sollte reichen:

<script type="text/javascript">
var b=document.getElementById("Browser");
if (b) b.onchange=function() {
var m=document.getElementById("marker");
if (m && (b.value=="Werkstattermin" || b.value=="Probefahrt")) m.style.display="block";
else m.style.display="none";
}
</script>

da du nun unbedingt eine (an sich sinnlose) Tabelle nutzen willst wäre table-row statt block evtl. sinnvoller.

Answer 2

ich wollte ja das wenn man auf Werkstattermin klickt ein Feld für Kennzeichen aufgeht

und wenn man auf Probefahrt klickt dann die Marke kommt

wieso ist die Tabelle nicht sinnvoll? versteh ich grad net sorry

Answer 3

<tr>
<td>Betreff</td>
<td><select name="Thema" id="Browser">
<option value="Bitte wählen">Bitte w&auml;hlen sie...</option>
<option value="Werkstattermin">Werkstattermin</option>
<option value="Probefahrt">Probefahrt</option>
<option value="Sonstiges">Sonstiges</option></select>

<script type="text/javascript">
var b=document.getElementById("Browser");
if (b) b.onchange=function() {
var tabelle=b.parentNode.parentNode.parentNode;
var r=tabelle.rows;
for (var i=0; i<r.length;i++) {
if (r.classname=="auswahl") r.style.display="none";
}
var m=document.getElementById(b.value);
if (m) m.style.display="table-row";
}
</script>

</td>
</tr>

<tr id="Probefahrt" style="display:none" class="auswahl">
<td>Marke</td>
<td><select name="Marke"><option value="Opel">Opel</option>
<option value="Subaru">Subaru</option>
<option value="Chevrolet">Chevrolet</option>
<option value="Isuzu">Isuzu</option>
<option value="Saab">Saab</option>
<option value="Peugeot">Peugeot</option>
</select></td>
</tr>
<tr id="Werkstattermin" style="display:none" class="auswahl">
<td>Kennzeichen</td>
<td><input type="text" name="Kennzeichen"></select></td>
</tr>

also: als id gleich den übergebenen Wert nutzen, sonst erfindest du das Rad dauernd neu. Außerdem table-row und eine Klasse nutzen, alle Elemente mit der Klasse werden als erstes versteckt, dann wird nur das einzelne sichtbar gemacht, das gerade erwählt wurde (oder gar keins, wenn nichts sinnvolles gewählt ist)


Die Tabelle erscheint hier nur zu Layout-Zwecken, darin stehen keine tabellarischen Daten. Das gilt heutzutage als schlechter Stil. Vor 10-20 Jahren machte man das mal so ...

Hier wäre eine (Definitions-)Liste angebrachter.

Answer 4

ok danke ...

hab jetzt denen code 1zu1 übernommen. (hab nicht viel Plan)

wenn ich jetzt erst probefahrt und dann werkstattermin auswähle zeigt es mir Kennzeichen und die Marken an...
wie kann ich es machen das nur bei Probefahrt die Marken und bei Werkstattermin das Kennzeichen kommt?

Answer 5

Tippfehler: es muss className heißen

Answer 6

hab ich gemacht (r.classname=="auswahl") aber geht leider immernoch nicht

nochjemand ne idee?

Answer 7

wo ist das online-Beispiel?

Answer 8

http://zf-gruppe.de/kontaktformular/kontaktform1.php

Answer 9

die [ i ] waren verschwunden. So geht's:

<script type="text/javascript">
var b=document.getElementById("Browser");
if (b) b.onchange=function() {
var tabelle=b.parentNode.parentNode.parentNode;
var r=tabelle.rows;
for (var i=0; i<r.length;i++) {
if (r[i].className=="auswahl") r[i].style.display="none";
}
var m=document.getElementById(b.value);
if (m) m.style.display="table-row";
}
</script>

ich hoffe, du hast neben dem Überprüfungs-JavaScript auf der Seite noch etwas geeignetes auf dem Server. Mich würde das so nerven, dass ich JavaScript einfach abschalte, um die Überprüfung zu umgehen.