Bedingte Anzeige von HTML-Elementformularen

Question

Oct 18, 2010, 06:58 PM

Bedingte Anzeige von HTML-Elementformularen

Nun, nach einer einstündigen Einführung in Javascript habe ich den folgenden Code gefunden. Es hat getan, was ich wollte, aber dann wollte ich etwas anderes und es wird nicht funktionieren.

Ich wollte, dass beim Klicken auf eine Schaltfläche ein bestimmtes Feld ausgeblendet und beim Klicken auf ein anderes Ja auch ein anderes ausgeblendet wird, ABER natürlich musste es die andere Show machen, sonst hätten wir nichts und das Ziel war es, verschiedene Felder anzuzeigen, je nachdem, was der Benutzer angeklickt hat (auf ein Optionsfeld). Auf kindliche Weise habe ich meinen Code erstellt und es hat funktioniert. Aber dann kam es zu mir, dass ich zuerst beide Felder ausblenden wollte, anstatt beide Felder anzuzeigen, und hier ist das Problem. Ich habe dem Parameter der Funktion "Telling it" den Wert 0 hinzugefügt, dass bei x = 0 die Sichtbarkeit ausgeblendet ist. Aber es wird mir nicht zuhören! Also funktioniert der Teil des Codes, in dem x = 1 und 2 steht, der über 0, nicht.

Es ist so ein einfacher Code, der jemanden zum Lächeln bringen kann, aber zum Teufel, es war sauber und es hat funktioniert. Weiß jemand, wie man die Felder versteckt, bevor man auf die Schaltflächen klickt?

Vielen Dank, ich entferne einige Tags des HTML

<html>
    <head>
        <script language="javascript">
            var x = 0;

            function hola(x) {
                if(x == 0) {
                    document.getElementById("cont1").style.visibility="hidden";
                    document.getElementById("cont2").style.visibility="hidden";
                }

                if(x == 1) {
                    document.getElementById("cont1").style.visibility="visible";
                    document.getElementById("cont2").style.visibility="hidden"; 
                }

                if(x == 2)  {
                    document.getElementById("cont1").style.visibility="hidden";
                    document.getElementById("cont2").style.visibility="visible"; 
                }
            }
        </script>
    </head>

    <body>
        <input type="button" onclick="hola(1)" value="hidefield2" id="boton1">
        <div id="cont1">
            <input type="text">
        </div>

        <input type="button" onclick="hola(2)" value="hidefield1" id="boton2">

        <div id="cont2">
            <input type="text">
        </div>
    </body>
<html>