• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage Mehrere Optionen verbinden

nicosammito

Neues Mitglied
Hallo erstmal,
Ich habe lange im Internet nach so einer Lösung gesucht und keine gefunden.
Also Ich wollte eigentlich ein Anfrage mit dem <select> und dem <option> tag machen (diese waren mit links hinterlegt).
Wenn man sich dann für die richtigen Seiten entschieden hat sollte man diese Seite mit einem Button öffnen können.
Das habe ich eigentlich auch ganz gut hinbekommen.
Aber hier erstmal der Code:
HTML:
<html>
    <head>
        <title>Test</title>
    </head>
    <body>

        <form>
            <select size="1" name="auswahl">
            <option value="https://jahresgeschenke.lima-city.de/">Startseite</option>
            </select>
            <select size="1" name="auswahl1">
                    <option value="nutz.html">Nutzungsbedinguengen</option>
                    <option value="weihnachten.html">weihnachten</option>
                    </select>
            <input type="button" value="Öffnen"
            onClick="top.location.href=this.form.auswahl.options[this.form.auswahl.selectedIndex].value">
            </form>
    </body>
</html>

Das Problem war jetzt, dass ich die "Auswahl1" nicht an die "Auswahl" anhängen könnte.
Also nochmal erklärt:
Ich wollte 2 Abfragen machen.
In diesem Fall war die erste die Startseite also "https://jahresgeschenke.lima-city.de/", dann gibt es ein 2 Feld wo man sich zwischen den Nutzungsbedingungen und der weihnachten.html entscheiden soll.
Wenn man sich entschieden hat soll eine ausgabe folgen, zum Beispiel bei der Eingabe Startseite+weihnachten.html soll dann die Webseite "https://jahresgeschenke.lima-city.de/weihnachten.html" geöffnet werden.
Ich hoffe ihr könnt mir helfen?!
 
Werbung:
Kurze Antwort:
JavaScript.

Lange Antwort:
Das Stichwort zum Thema JavaScript könnte eine if-Abfrage sein.
Ansonsten gäbe es noch die Variante mit 'case'.
Die Variante mit case bevorzuge ich im übrigen, das ist aber Geschmackssache.
Hier mal ein kleines Beispiel mit case:
https://jsfiddle.net/Aaron3219/dsc2dyhn/18/

Wenn also case 0 ist, also das 1. Objekt selected wurde, würde dann deine andere Auswahl angezeigt werden.
Wenn case 1, also das 2. Objekt selected wurde, würde dann die andere Auswahl oder was auch immer angezeigt werden soll.

Edit:
Wenn man sich entschieden hat soll eine ausgabe folgen, zum Beispiel bei der Eingabe Startseite+weihnachten.html soll dann die Webseite "https://jahresgeschenke.lima-city.de/weihnachten.html" geöffnet werden.
In deinem Fall würde dann halt einfach der Link geöffnet werden.

Edit 2:
Jetzt ist mir noch dein Button aufgefallen.
Da könntest du es so machen:
per onselect setzt du eine Variable und veränderst sie je nach option.
Der Button führt einfach nur eine if-Abfrage aus, wie die Variable heißt und öffnet den entsprechenden Link.

Alternativ könntest du natürlich auch hier eine case-Abfrage machen, die, je nach case, die verschiedenen Links öffnet.
 
Ich weiß nicht so genau meinst du das so

*** Link entfernt, weil nicht mehr erreichbar ***
 
Zuletzt bearbeitet:
Werbung:
... oder man verfolgt den Weg, den nicosammito eingeschlagen hat, weiter:
Code:
    <form>
        <select size="1" name="auswahl">
            <option value="https://jahresgeschenke.lima-city.de/">Startseite</option>
        </select>
        <select size="1" name="auswahl1">
            <option value="nutz.html">Nutzungsbedinguengen</option>
            <option value="weihnachten.html">weihnachten</option>
        </select>
        <input type="button" value="Öffnen" onclick="gotourl(this.form);">
    </form>
    <script>
        function gotourl(frm) {
            var sel = frm.auswahl;
            var sel1 = frm.auswahl1;
            var val = sel.options[sel.selectedIndex].value;
            var val1 = sel1.options[sel1.selectedIndex].value;
            var url = val + val1;
            window.location.href = url;
        }
    </script>
@nicosammito : Zzt. hast Du nur eine Option in dem ersten Select. Wenn mehr hinzu kommen, müsste dann nicht auch für jede der zweite Select anders aufgebaut werden?

@Aaron3219 : Der Weg mit if oder case wird häufig von Anfängern eingeschlagen, ist aber hier nicht optimal. Besser ist es, das value-Attribut zu verwenden, wie es der TO schon praktiziert hat, oder, wenn dieses schon für etwas anderes belegt ist oder semantisch nicht passt, ein data-Attribut. Das hat den Vorteil, dass man bei Änderungen und Erweiterungen nur das HTML ändern muss, während man bei deinem Ansatz HTML und Javascript ändern muss.



Danke hat super funktioniert Vielen Dank :-)
 
Zurück
Oben