Basierend auf einem Forums-Beitrag vom 14.08.1998 von:
Christian Wichmann, alaska@jadeweb.de
und auf einem Forums-Beitrag vom 16.08.1998 von:
Felix, felix.mueller@bigfoot.de
Die Realisierung der Selektion einer Auswahlliste kann alternativ durch einen Button erfolgen. Dazu wird der Button mit einer JavaScript-Funktion unterlegt. Diese Funktion übernimmt die Ausführung der Auswahl.
<html>
<head>
<title>Bundesländer</title>
<script language = "javaScript">
<!--
function go()
{
window.location.href = window.document.Landauswahl.Liste |
Nach Klick auf den Button wird die Funktion go() aufgerufen. Mit window.document.Landauswahl.Liste.[..].value wird die Auswahlliste "Landauswahl" angesprochen und deren Wert ausgelesen. Der Ausdruck [window.document.Landauswahl.Liste.selectedIndex] spezifiziert diesen Wert auf die getroffene Auswahl. Lesen Sie hierzu auch den SELFHTML-Abschnitt 
options: selectedIndex.
 
|
Basierend auf einem Forums-Beitrag vom 14.08.1998 von:
Christine Kuehnel, kuehnel@screenExa.net
Die Übertragung der Formulardaten an den Server wird mittels eines Submitbuttons ausgelöst. Möchten Sie diesen durch eine Grafik ersetzen, können Sie grafische Buttons zum Absenden definieren.
Ein Nachteil dieser Methode ist jedoch, dass Event-Handler wie z.B. onMouseOver nicht angewendet werden können und auch Rollover nicht funktionieren. <input type="image"> ist kein Image-Objekt und erlaubt keine Änderung des Bildes.
Ein Ausweg bildet folgendes Verfahren. Anstatt eines Buttons verwenden Sie einen ganz normalen, bildunterlegten Link. Beim Anklicken des Links wird dann mittels der Methode submit() der Formularwert übergeben.
<a href="JavaScript:self.document.Formularname.submit()"><img src="button.gif" width="150" height="50" border="0" alt="Submit"></a> |
Der Resetbutton lässt sich unter Verwendung von reset() analog simulieren.
Diese Methode ist nur dann ausführbar, wenn das Formular zum Server übertragen und weiterverarbeitet wird.
|
|
Basierend auf einem Forums-Beitrag vom 01.09.1998 von:
Christian Wichmann, alaska@jadeweb.de
Thomas Kienzle, thomas_kienzle@compuserve.com
Möchten Sie beim Laden einer Datei ein bestimmtes Formularfeld mit dem Focus versehen, so können Sie diesen Aufruf verwenden.
<body onLoad="document.Formularename.Feldname.focus()">
<html> <head> <title>Inputfocus</title> </head> <body onLoad="document.form1.feld1.select();document.form1.feld1.focus()"> <form name="form1" method="post" action="mailto:xyz@abc.com"> <input type="text" name="feld1" size="15" maxlength="15" value="Kommentar"> </form> </body> </html> |
Im Beispiel wurde ein mit einem Wert vorbelegtes Feld verwendet. In diesem Zusammenhang ist es sinnvoll, diese Vorgabe dann automatisch zu selektieren. Der Benutzer kann dann gleich die Vorgabe überschreiben. Die Selektion geschieht durch den Aufruf von document.form1.feld1.select(). Lesen Sie hierzu auch den SELFHTML - Abschnitt Elements.
Basierend auf Forums-Beiträgen vom 31.03.1999 von:
Torsten Meletzki, Torsten.Meletzki@schwaegerl.de
Stefan Muenz, muenz@csi.com
und vom 1.4.1999 von:
Calocybe, calocybe@geocities.com
Innerhalb von Formularen werden zur Auswahl von Optionen häufig Checkboxen eingesetzt. Dem Anwender bleibt es überlassen, ob er keine, eine oder mehrere Checkboxen auswählt. Manchmal ist es jedoch wünschenswert, dass zumindest eine Auswahl getroffen wird. Sie können dies mittels einer Kontrollfunktion erzwingen, die durch den Event-Handler onSubmit ausgelöst wird. Lesen Sie hierzu auch den SELFHMTL-Abschnitt Formulareingaben überprüfen.
<html><header>
<title>Checkboxüberprüfung</title>
<script language="JavaScript">
<!--
function validate_form()
{
validity = true;
if (check_auswahl()==false)
{ validity = false; alert("Bitte aktivieren Sie eine Option."); }
if (validity) alert ("Das Formular wird abgeschickt.");
return validity;
}
function check_auswahl()
{
for (i=0; i<document.form.testfeld1.length; i++)
if (document.form.testfeld1[i].checked) return true;
return false;
}
//-->
</script>
</header>
<body>
<form method="post" name="form" action="testcgi" onSubmit="return validate_form()">
<p>Wählen Sie eine der folgenden Optionen:</p>
<p>
Option 1 <input type="checkbox" name="testfeld1" value="ON">
Option 2 <input type="checkbox" name="testfeld1" value="ON">
Option 3 <input type="checkbox" name="testfeld1" value="ON">
</p>
<input type="Submit" name="Senden" value="Senden">
<input type="reset">
</form>
</body></html> |
Vor dem Absenden des Formulars wird durch den Event-Handler onSubmit die Funktion validate_form() aufgerufen. Von der Funktion validate_form() wird die Funktion check_auswahl() aufgerufen. Diese zweite Funktion prüft, ob mindestens eine der Checkboxen aktiviert wurde. Ist dies der Fall, gibt check_auswahl() den Wert wahr an die aufrufende Funktion zurück. Wurde keine Auswahl getroffen, gibt die Funktion validate_form() den Wert falsch zurück und das Absenden des Formulars wird verhindert.
In gleicher Weise können Sie auch die Aktivierung von Radiobuttons überprüfen.
Dieses Beispiel ist ab den MS Internet Explorer 4.0 und dem Netscape Navigator 3.0 verwendbar.
|
|
Basierend auf Forums-Beiträgen vom 25.03.1999 von:
Amit, OmmiBis@aol.com
Mirko, mirko@rockt.nu
Für manche Offline-Anwendungen sind konkrete Laufwerks- oder Pfadangaben erforderlich. In diesen Fällen sind Sie auf die Eingaben des Nutzers angewiesen. Das folgende Beispiel zeigt, wie Sie mit Hilfe eines Formulars und einer JavaScript-Funktion auf lokale Laufwerke zugreifen können.
<html><head><title>Variabler Laufwerkszugriff in Offline-Anwendungen</title></head>
<body>
<p>In welchem Laufwerk liegt die CD? Nach Aktivierung des Links, wird diese abgespielt.</p>
<form name="formular">
<select name="laufwerk" onChange="changeLink()">
<option value="C">C
<option value="D">D
<option value="E">E
</select>
</form>
<div id="CDLink" style="position:absolute;top:50;left:30;">
<a href="file://C:/track01.cda">Titel01</a></div>
<script language="JavaScript">
<!--
function changeLink()
{
lwidx = document.formular.laufwerk.selectedIndex;
laufwerk = document.formular.laufwerk.options[lwidx].value;
if ( navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion >= "4")
{ document.all.CDLink.innerHTML = "<a href=\"file://"+laufwerk+":/track01.cda\">Titel01</a>"; }
else if (document.layers)
{document.CDLink.document.open();
document.CDLink.document.write("<a href=\"file://"+laufwerk+":/track01.cda\">Titel01</a>");
document.close();}
}
//-->
</script>
</body></html>
|
Das vom Nutzer im Auswahlformular ausgewählte Laufwerk wird durch die Funktion changeLink() ausgewertet.
Anschließend wird im Microsoft Internet Explorer der Link in <div id="CDLink">
unter der Verwendung der Methode innerHTML neu geschrieben.
Im Netscape Navigator wird das Gleiche unter Nutzung der Methode document.write() und der Document-Eigenschaft des Layerobjektes erreicht.
Nach Aktivierung des Links wird im Beispiel eine CD abgespielt. Bitte beachten Sie, dass Sie für die Nutzung des Beispieles gegebenenfalls Browsereinstellungen anpassen müssen.
Dieses Beispiel können Sie im Microsoft Internet Explorer und im Netscape Navigator ab der Version 4 verwenden. Es ist nicht möglich die browserinternen Sicherheitsabfragen bei Zugriff auf unsichere Elementen zu umgehen.
|
| |
weiter: |
Sonstiges zu JavaScript
|
zurück: |
Dynamische Images und Rollovers
|
SELFHTML
Forums-Auslese
JavaScript |
|
© 2000 das Redaktionsteam
