Heim > Web-Frontend > js-Tutorial > JavaScript-Formularvalidierungs-Implementierungscode_Javascript-Kenntnisse

JavaScript-Formularvalidierungs-Implementierungscode_Javascript-Kenntnisse

Y2J
Freigeben: 2017-05-23 13:22:41
Original
1723 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich der Implementierungscode der JavaScript-Formularüberprüfung ausführlich vorgestellt, der einen gewissen Referenzwert hat.

JavaScript kann zum Verarbeiten der Daten verwendet werden, bevor sie an den Server gesendet werden . Validieren Sie diese Eingabedaten im HTML-Formular

JavaScript-Formularvalidierung

JavaScript kann verwendet werden, um diese Eingabedaten im HTML-Formular zu validieren, bevor die Daten vorliegen An den Server gesendet. Geben Sie die Daten zur Überprüfung ein.
Diese typischen durch JavaScript überprüften Formulardaten sind:
Hat der Benutzer die erforderlichen Felder im Formular ausgefüllt?
Ist die vom Benutzer eingegebene E-Mail-Adresse legal?
Hat der Benutzer ein gültiges Datum eingegeben?
Hat der Benutzer Text in das numerische Feld eingegeben?

Erforderliche (oder erforderliche) Elemente

Die folgende Funktion wird verwendet, um zu überprüfen, ob der Benutzer die erforderlichen (oder erforderlichen) Felder ausgefüllt hat im Formular auswählen) Projekt. Wenn erforderlich oder das erforderliche Feld leer ist, wird das -Warnfeld angezeigt und der -Rückgabewert der Funktion ist falsch, andernfalls ist der Rückgabewert der Funktion wahr (Bedeutung). es gibt kein Problem mit den Daten):


function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
 {alert(alerttxt);return false}
else {return true}
}
}
Nach dem Login kopieren

Hier ist der Code zusammen mit dem HTML-Formular:


<html>
<head>
<script type="text/javascript">

function validate_required(field,alerttxt)
{
with (field)
 {
 if (value==null||value=="")
  {alert(alerttxt);return false}
 else {return true}
 }
}

function validate_form(thisform)
{
with (thisform)
 {
 if (validate_required(email,"Email must be filled out!")==false)
  {email.focus();return false}
 }
}
</script>
</head>

<body>
<form action="submitpage.htm" onsubmit="return validate_form(this)" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit"> 
</form>
</body>

</html>
Nach dem Login kopieren

E-Mail-Validierung

Die folgende Funktion prüft, ob die eingegebenen Daten der grundlegenden Syntax einer E-Mail-Adresse entsprechen.
Das bedeutet, dass die eingegebenen Daten das @-Symbol und den Punkt (.) enthalten müssen. Gleichzeitig darf @ nicht das erste Zeichen der E-Mail-Adresse sein und es muss mindestens ein Punkt nach @ stehen:


function validate_email(field,alerttxt)
{
with (field)
{
apos=value.indexOf("@")
dotpos=value.lastIndexOf(".")
if (apos<1||dotpos-apos<2) 
 {alert(alerttxt);return false}
else {return true}
}
}
Nach dem Login kopieren

Das Folgende ist vollständig Code zusammen mit dem HTML-Formular:








Email:
Nach dem Login kopieren

[Verwandte Empfehlungen]

1. Kostenloses Javascript-Video-Tutorial

2. Detaillierte Erläuterung von Remote-Beispielen für Bootstrap-Modal-Boxen

3. Detaillierte Erläuterung von Beispielen für die Implementierung des Marquee-Scrolling-Effekts

4. JS-Produktion der QQ-Chat-Nachrichtenanzeige und Codebeispiel der Funktion zum Senden von Kommentaren

5. Eine einzelne Zeile von JS zur Implementierung der Überprüfung des mobilen Geldformats

Das obige ist der detaillierte Inhalt vonJavaScript-Formularvalidierungs-Implementierungscode_Javascript-Kenntnisse. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage