In diesem Tutorial erkläre ich euch bedingte Anweisungen im Javascript. Sie sind, wie ihr Name schon sagt, dazu da um die Ausführung bestimmter Anweisungen von speziellen Bedingungen abhängig zu machen.

Man unterscheidet hier bei zwischen der Wenn-Dann-Bedingung (if) und der Entweder-Oder-Abfrage.

Wenn -> Dann

Die Wenn-Dann Bedingung ist sehr simpel aufgebaut. Wenn eine gewisse Bedingung gegeben ist, dann wird eine bestimmte Anweisung ausgeführt.

Hier mal ein Beispiel:

<script type="text/javascript">
function Frage ()
{
var Antwort= "Miau";
var Eingabe = window.prompt("Was macht die Katze?", "");
if (Eingabe != Antwort)
{
alert("Falsche Antwort!");
}
else
{
location.href = "richtig.html";
}
}
</script>

Was passiert da?

In unserem Beispiel öffnet sich beim Aufrufen der Funktion ein kleines Fenster in dem eine Frage gestellt wird. Wenn die Antwort richtig ist, wird man auf eine eine Seite namens richtig.html weitergeleitet, wenn sie falsch ist kommt ein alert.

Erklärung:

In der Funktion Frage() sind zunächst zwei Variablen festgelegt. Antwort enthält unsere festgelegte, richtige Antwort auf die Frage und Eingabe enthält den Rückgabewert von window.prompt(), also das was der Besucher als Antwort einträgt.

Nun wird die Eingabe des Besuchers mit der festgelegten Antwort verglichen. Wenn (if ) die Eingabe ungleich (!= ) der Antwort ist, dann kommt ein alert() in dem "Falsche Antwort!" steht. Ansonsten (else), also wenn die Eingabe mit der Antwort übereinstimmt, wird man mittels location.href auf die Seite "richtig.html" weitergeleitet.

Hoffe das war soweit verständlich. Kommen wir nun zum zweiten Teil des Tutorials.

Entweder - Oder

Für Entweder-Oder Abfragen gibt es einen speziellen Syntax, den man alternativ zu den Wenn-Dann (if/else) Bedingungen nutzen kann.

Hier erstmal ein Beispiel:

Javascript:

<script type="text/javascript">
function Antwort ()
{
var Ergebnis = (document.Formular.Eingabe.value == "Miau") ? "RICHTIG!" : "FALSCH!";
document.Formular.Eingabe.value = "Die Antwort ist " + Ergebnis;
}
</script>

HTML:

<form name="Frage">
<h1>Was macht die Katze?</h1>
<input type="text" name="Eingabe" size="50">
<input type="button" value="Senden" onclick="Antwort()">
</form>

Was passiert da?

Ähnlich wie im Beispiel eben, wird eine Frage in einem Formular gestellt und der Besucher muss seine Antwort dort eingeben und dann das Formular abschicken. Beim Abschicken wird eine Funktion aufgerufen, die die Antwort prüft und dann entsprechend ausgibt, ob sie richtig oder falsch war.

Erklärung:

Durch onclick="Antwort()" wird die Funktion Antwort() aufgerufen. In der Funktion ist die Variable Ergebnis festgelegt, die unsere richtige Antwort "miau" enthält. Dort wird dann mittels document.Formular.Eingabe.value geprüft, ob das was in das Formular eingegeben wurde mit der richtigen Antwort übereinstimmt. Abhängig davon, wird der Variable Ergebnis entweder der Wert RICHTIG oder FALSCH zugeordnet (was hinter dem ? steht wird bei richtiger Antwort ausgegeben, bei falscher Antwort das was hinter dem : steht). Danach erscheint durch document.Formular.Eingabe.value = "Die Antwort ist " + Ergebnis; in dem Eingabefeld des Formulars Variable in einem Antwortsatz ausgegeben.

Das wars auch schon.
Ich hoffe das hilft euch weiter und viel Spaß beim Ausprobieren. ;)