ANWENDUNGSBEISPIEL
Zurück zur Script-Auswahl oder dieses
Script-Archiv laden?
EINBINDUNG DES SCRIPTS IN DEINE HOMEPAGE:
Falls Du das Script-Archiv bereits geladen hast, so brauchst Du jetzt nicht
mehr weiterzulesen. Das Archiv enthält auch diese Beispieldatei
(wochentag.html) und kann deshalb Offline durchgesehen werden.
- Das vorliegende Script besteht aus zwei Teilen:
1. Einem Java-Script im Head-Teil
und
2. Dem Eingabeformular im Body-Teil.
Um das Script einfach in Deine HomePage zu bekommen, gehst Du am Besten
folgendermaßen vor:
Du markierst am Bildschirm weiter unten nacheinander die gefärbten Textabschnitte
mit der Maus und stellst sie dann mit Strg-C in die Zwischenablage.
1. Kopiere das Java-Script mit Strg-V den HEAD-Bereich Deiner HTML-Seite.
2. Kopiere das Eingabeformular in den Body-Bereich.
- Das Java-Script für den Head-Bereich sieht folgendermaßen aus (Groß- und Kleinschreibung
muss beachtet werden!):
<META http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript">
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- //Fuer alte Browser verstecken
function calculate() {
month = document.datumseingabe.month.selectedIndex;
month = document.datumseingabe.month.options[month].value;
day = document.datumseingabe.day.selectedIndex;
day = document.datumseingabe.day.options[day].value;
year = document.datumseingabe.year.value;
var oyear=year
var dob = " "+ year +", "+month + ", "+day;
var thenx = new Date(dob);
var year=thenx.getYear();
if (year<100) year="19" + thenx.getYear();
else year=thenx.getYear();
if (year > 1969) wyear=year;
else {
if (oyear<1900) {
if (oyear>1800) {
wrelyear= (eval(oyear)-1801)%(28);
wyear = wrelyear+1981;
}
else wyear = 1970
}
else
if (oyear>1900) {wrelyear= (eval(oyear)-1901)%(28);
wyear= wrelyear+1985
}
else
if (oyear==1900) {wyear= 1990;
}
}
var dob = " "+ wyear +", "+month + ", "+day;
var thenx = new Date(dob);
var theday = thenx.getDay()+1;
var date=thenx.getDate();
var weekday = new Array(6);
weekday[1]="Sonntag";
weekday[2]="Montag";
weekday[3]="Dienstag";
weekday[4]="Mittwoch";
weekday[5]="Donnerstag";
weekday[6]="Freitag";
weekday[7]="Samstag";
if (day != date) alert("Das kann nicht sein, falsches Datum!");
else {
dayborn = weekday[theday];
dob = dayborn + ", " + month + " " + date + ", " + oyear + ".";
alert("Der ermittelte Wochentag ist ein " + dayborn);
}
}
// - End of JavaScript - -->
</SCRIPT>
Hinweise zur individuellen Anpassung
Hier kommt eine gute Nachricht: Es gibt in diesem Bereich absolut nichts anzupassen!
- Das Eingabeformular an der gewünschten Position im Body-Teil sieht
folgendermaßen aus:
<form name=datumseingabe>
<table border=2 cellspacing=0 cellpadding=0 bgcolor=white>
<tr>
<td colspan=3>
Zur Wochentagsermittlung<BR>
gib bitte das Datum ein:
</td>
</tr>
<tr>
<td align=center>
<select name="day">
<option value="" selected>Tag
<option value="1">01
<option value="2">02
<option value="3">03
<option value="4">04
<option value="5">05
<option value="6">06
<option value="7">07
<option value="8">08
<option value="9">09
<option value="10">10
<option value="11">11
<option value="12">12
<option value="13">13
<option value="14">14
<option value="15">15
<option value="16">16
<option value="17">17
<option value="18">18
<option value="19">19
<option value="20">20
<option value="21">21
<option value="22">22
<option value="23">23
<option value="24">24
<option value="25">25
<option value="26">26
<option value="27">27
<option value="28">28
<option value="29">29
<option value="30">30
<option value="31">31
</select>
</td>
<td align=center>
<select name="month">
<option value="" selected>Monat
<option value="January">Jan
<option value="February">Feb
<option value="March">Mär
<option value="April">Apr
<option value="May">Mai
<option value="June">Jun
<option value="July">Jul
<option value="August">Aug
<option value="September">Sep
<option value="October">Okt
<option value="November">Nov
<option value="December">Dez
</select>
</td>
<td align=center>
<input type=text name=year value="20" size=4 maxlength=4>
</td>
</tr>
</table>
<input type=button value="dann klick hier" onClick="calculate()">
</form>
Hinweise zur individuellen Anpassung
Noch eine gute Nachricht: Auch hier brauchst Du nichts anpassen!
Leider sieht das Eingabeformular dann nicht so "schön" aus. HTML ist bei der Gestaltung
sehr hilflos. Hier musst Du mit CSS nachhelfen. Meine Version des Eingabeformulars ist
folgendermaßen aufgebaut (Die CSS-Veränderungen sind grün eingefärbt):
<div align=center>
<form name=datumseingabe>
<table style="border-style:ridge; border-width:3px; border-color:#bdb76b; background-color:#bdb76b;">
<tr><td colspan=3 STYLE="font-family:verdana, arial, helvetica, sans-serif; font-size:10pt;
color:#000000; text-align:center;">
Zur Wochentagsermittlung<BR>
gib bitte das Datum ein:
</td></tr>
<tr><td align=center>
<select name="day">
<option value="" selected>Tag
<option value="1">01
<option value="2">02
<option value="3">03
<option value="4">04
<option value="5">05
<option value="6">06
<option value="7">07
<option value="8">08
<option value="9">09
<option value="10">10
<option value="11">11
<option value="12">12
<option value="13">13
<option value="14">14
<option value="15">15
<option value="16">16
<option value="17">17
<option value="18">18
<option value="19">19
<option value="20">20
<option value="21">21
<option value="22">22
<option value="23">23
<option value="24">24
<option value="25">25
<option value="26">26
<option value="27">27
<option value="28">28
<option value="29">29
<option value="30">30
<option value="31">31
</select>
</td>
<td align=center>
<select name="month">
<option value="" selected>Monat
<option value="January">Jan
<option value="February">Feb
<option value="March">Mär
<option value="April">Apr
<option value="May">Mai
<option value="June">Jun
<option value="July">Jul
<option value="August">Aug
<option value="September">Sep
<option value="October">Okt
<option value="November">Nov
<option value="December">Dez
</select>
</td>
<td align=center>
<input type=text name=year value="20" size=4 maxlength=4>
</td>
</tr>
</table>
<input type=button value="dann klick hier" onClick="calculate()" style="border-style:ridge; margin-top:6px;
padding-left:15px; padding-right:16px; font-family:verdana, arial, helvetica, sans-serif;
font-size:10pt; color:#ff0000; background-color:#f0e68c; border-color:#bdb76b; border-width:2px;">
</form>
</div>
Das Script stammt von The JavaScript Source!!
Ich habe es allerdings eingedeutscht und ein bisschen angepasst.