Warning: file_put_contents(/home/www/web1/html/php_dev/test.txt) [function.file-put-contents]: failed to open stream: Permission denied in /home/www/web1/html/php_dev/sys/lib.activity.php on line 58 E-Mailprüfung mit JavaScript PHP Tutorials nicht nur für Anfänger php-resource.de
Dieses einfache Formular beinhaltet ein Textfeld für die
Eingabe der E-Mailadresse und einen Button um die Daten absenden zu können.
Wichtig bei diesem Formular sind zwei Angaben im form-Tag:
- Der Name des Formulars - name="emailtest"
- und der Event-Handler onSubmit
Den Namen brauchen wir, um nachher die Elemente (Textfeld mit der E-Mailadresse)
des Formulars ansprechen zu können. Den Event-Handler brauchen wir, um dem
Browser zu sagen, dass er vor dem Absenden der Daten eine Funktion namens testEmail
aufrufen soll und das Ergebnis hiervon zurückgeben (return) soll.
So weit, so gut.
Wir werden nun eine Funktion schreiben, in der unsere E-Mailadresse mit einem
sogenannten Regulären Ausdruck auf die Gültigkeit geprüft wird.
Da die Funktion auf jeden Fall vor dem Funktionsaufruf (in unserem Fall onSubmit)
deklariert werden muss, schreiben wir diese in den head-Bereich unserer
HTML-Seite. Allgemein ist es zu empfehlen, JavaScript-Funktionen in den
head-Bereich zu schreiben.
Wird eine Funktion erst nach einem Funktionsaufruf deklariert,
funktioniert das ganze nicht!
Wir schreiben also innerhalb der HTML-Tags <head> und </head>
folgendes:
05 alert('E-Mailadresse ist gültig :-)');
06 return true;
07 }else{
08 alert('E-Mailadresse ist NICHT gültig :-(');
09 document.emailtest.email.focus();
10 return false;
11 }
12 }
13 //-->
14 </script>
Erklärung der Funktion
Die ersten zwei und die letzten zwei Zeilen brauch ich hoffentlich nicht zu erklären.
In Zeile 03 deklarieren wir eine Funktion indem wir das Schlüsselwort function
gefolgt vom Funktoinsnamen testEmail und folgenden runden Klammern ()
schreiben.
den Namen der Funktion können wir beliebig wählen. Die runden Klammern
brauchen wir in jedem Fall.
Es folgt noch die geöffnete, geschweifte Klammer { als Zeichen dafür,
dass nun die einzelnen Anweisungen der Funktion folgen.
In Zeile 04 geht´s auch gleich richtig zur Sache. Diese Zeile ist das Herzstück
unserer Funktion.
Wir beginnen eine if-Abfrage in der wir das Textfeld email des
Objektes emailtest ansprechen. Und zwar wird der Text (Inhalt) des
Textfeldes (value) angesprochen und geprüft. if(document.emailtest.email.value.match(...) bedeutet hier, dass der
Inhalt des Textfeldes email mit dem übereinstimmen muss, was in der
JavaScript-Methode match() angegeben ist.
Jetzt wird es für viele wahrscheinlich sehr kompliziert und viele werden nur
Bahnhof lesen/verstehen. Aber nach Durchsicht der Erklärung müsste etwas Licht
ins Dunkel gebracht werden ;-).
Zunächst einmal der reguläre Ausdruck für unsere E-Mailprüfung:
Wir beginnen mit einem Slash (/) am Anfang und am Ende des regulären
Ausdruckes. Mit diesen Slashes bestimmen wir, dass es sich bei der folgenden
Zeichenkette um einen regulären Ausdruck handelt.
Als nächstes tippen wir ein Dächlein (^), der sogenannte Zirkumflex.
Dieser steht für den Anfang einer Zeichenkette.
Nun tippen wir ein Dollarzeichen ($), das uns das Ende der Zeichenkette
kennzeichnet.
Alles was zwischen diesen beiden Zeichen liegt, ist unsere zu prüfende
E-Mailadresse.
So sieht unser regulärer Ausdruck inzwischen aus: /^$/
Unsere zu prüfende E-Mailadresse besteht aus drei Teilen:
Zeichenkette vor dem @-Zeichen
Domainname nach dem @-Zeichen
Die Top-Level-Domain (de, com, info, museum usw usw usw)
Wer sich den regulären Ausdruck genauer anschaut, wird
ebenfalls drei prüfende Bereiche feststellen, die im Folgenden erläutert
werden.
Wir sehen drei mal einen Bereich innerhalb von eckigen Klammern [] und
drei mal einen Bereich von geschweiften Klammern {}.
Innerhalb der eckigen Klammern werden die Zeichen definiert, welche in der
E-Mailadresse erlaubt sind.
Innerhalb der geschweiften Klammern definieren wir die Anzahl, wieviele Zeichen
mindestens vorhanden sein müssen und wie viele Zeichen maximal vorhanden sein dürfen.
Der erste Teil vor dem @-Zeichen
Innerhalb der eckigen Klammern
Hier definieren wir die Zeichen, die in der E-Mailadresse vor dem @-Zeichen
erlaubt sind.
In unserem Fall also a-zA-Z0-9_.-
Wir erlauben alle Kleinbuchstaben (a-z), alle Großbuchstaben (A-Z),
alle Ziffern (0-9), den Unterstrich (_), den Punkt (.)
und den Bindestrich (-).
Da der Punkt in einem regulären Ausdruck eine besondere Bedeutung hat, müssen
wir diesen, wenn wir ihn als Zeichen erlauben wollen, mit einem Backslash ()
auskommentieren.
Innerhalb der geschweiften Klammern
Hier definieren wir die Anzahl an Mindest- und Maximalzeichen, die die
E-Mailadresse vor dem @-Zeichen enthalten darf
In unserem Fall {2,}
Die erste Zahl definiert die Mindestanzahl an Zeichen, die vorhanden sein müssen.
Nach dem Komma können wir eine Zahl schreiben, die die maximal erlaubte
Anzahl an Zeichen definiert. Diese lassen wir aber hier offen.
Es können also beliebig viele Zeichen getippt werden. Würden wir das Komma
weglassen, so würde unsere E-Mailadresse nur dann stimmen, wenn genau zwei
Zeichen vor dem @-Zeichen stehen. Probiert es aus!
Wir tippen noch das @-Zeichen, als Merkmal dafür, dass das
@-Zeichen folgt und vorhanden sein muss.
Der zweite Teil nach dem @-Zeichen
Innerhalb der eckigen Klammern
Hier definieren wir wieder die erlaubten Zeichen, die in einer E-Mailadresse
nach dem @-Zeichen vorhanden sein dürfen.
Dies sieht bei uns wie folgt aus: [a-z0-9-]
Wir erlauben hier nur alle Kleinbuchstaben (a-z), alle Ziffern (0-9)
und den Bindestrich (-).
Innerhalb der geschweiften Klammern
Hier wird wieder die Anzahl an Mindest- und Maximalzeichen definiert.
In unserem Fall {3,}
Warum jetzt hier plötzlich drei Zeichen mindestens?
Ganz einfach:
Ein Domainname muss aus mindestens drei Zeichen bestehen. Und da nach
dem @-Zeichen der Domainname folgt, geben wir als Minimum drei an.
Es folgt wieder das Komma und kein Maximum.
Nach dem Domainnamen folgt bekanntlich der Punkt
(irgendwas@irgendwo.wo).
Also tippen wir wieder den Backslash um anzuzeigen, dass der Punkt keine
Funktion des regulären Ausdrucks erfüllt, sondern, dass der Punkt an dieser
Stelle der E-Mailadresse vorhanden sein muss.
Der dritte Teil nach dem Punkt für die Top-Level-Domain
Innerhalb der eckigen Klammern
Wieder einmal geht es "nur" um die Definition der erlaubten
Zeichen.
Die sieht so aus: [a-z]
Hier werden nur alle Kleinbuchstaben erlaubt (a-z). Wenn einer von
Euch Top-Level-Domains kennt, die noch andere Zeichen beinhalten, bitte eine
E-Mail an mich ;-)
Innerhalb der geschweiften Klammern
Eine Top-Level-Domain besteht aus mindestens zwei, maximal vier Zeichen oder
museum.
Aus diesem Grunde sieht unser Ausdruck hierfür folgendermaßen aus: {2,4}|museum
Wir definieren die Mindestzahl zwei und die Maximalzahl vier. Es werden
keine fünf Zeichen oder ein einzelnes Zeichen akzeptiert.
Da es aber inzwischen die Top-Level-Domain museum gibt, müssen wir
diese berücksichtigen.
Dies geschieht durch das Anhängen per ODER (Pipe-Zeichen |) gefolgt
von museum.
Nach unserer Definition der if-Abfrage folgt eine geöffnete
geschweifte Klammer als Zeichen dafür, was passieren soll, wenn die Bedingung
erfüllt ist.
Ist die Bedingung erfüllt (korrekte E-Mailadresse), folgen zwei Anweisungen:
alert('E-Mailadresse ist gültig :-)');
return true;
Die erste Anweisung erzeugt ein Fensterlein mit einer
OK-Schaltfläche und dem Text E-Mailadresse ist gültig :-)
Die zweite Anweisung besagt, dass die Funktion als Ergebnis true (wahr)
zurückgeben soll. Die E-Mailadresse stimmt also und die Daten werden gesendet.
Sollte die eingegebene E-Mailadresse allerdings falsch sein, so geht unsere
Funktion in den else-Zweig.
Der else-Zweig beinhaltet drei Anweisungen:
alert('E-Mailadresse ist NICHT gültig :-(');
Es erscheint ein kleines Fensterlein mit OK-Schaltfläche und dem Text E-Mailadresse
ist NICHT gültig :-(
document.emailtest.email.focus();
besagt, dass unser Textfeld des Formulars den Fokus bekommt. Soll heißen,
der Cursor wird in das Textfeld gesetzt.
return false; heißt:
Unsere Funktion gibt den Wert 0 zurück. Die Daten werden also nicht
gesendet. Stattdessen haben wir erneut die Möglichkeit, unsere
E-Mailadresse einzugeben.
Die freie MySQL-Alternative MariaDB wurde in der stabilen Version 5.5.23 veröffentlicht und soll einige Verbesserungen gegenüber Oracles Communityversion von MySQL mitbringen.
Im Forum suchen
|16.06.2003 | 
5567 | KAT : 
Deutsch 
