Heim > Web-Frontend > js-Tutorial > Hauptteil

Javascript-Formularvalidierung Enzyklopädie_Javascript-Kenntnisse

WBOY
Freigeben: 2016-05-16 15:45:43
Original
1305 Leute haben es durchsucht

Die typischen von JavaScript validierten Formulardaten sind wie folgt:

1. Hat der Benutzer die erforderlichen Elemente im Formular ausgefüllt?

2. Ist die vom Benutzer eingegebene E-Mail-Adresse legal?

3. Hat der Benutzer ein gesetzliches Datum eingegeben?

4. Hat der Benutzer Text in das numerische Feld eingegeben?

Hier ist der Bestätigungscode für Benutzername und Passwort:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script>
function validateForm()
{
 var username = document.forms["myForm"]["username"].value;
 var password = document.forms["myForm"]["password"].value;
 alert(username+" "+password);
}
</script>
</head>
<body>
<form name="myForm" action="" onSubmit=" return validateForm()" method="post">
用户名:<input type="text" name="username"/><br/>
密码:<input type="password" name="password"/><br/>
 <input type="submit" value="提交"/>
</form>
</body>
</html>
Nach dem Login kopieren

Erforderliche (oder erforderliche) Artikelüberprüfung:

Mit der folgenden Funktion wird überprüft, ob der Benutzer die erforderlichen (oder erforderlichen) Elemente im Formular ausgefüllt hat. Wenn erforderlich oder das erforderliche Feld leer ist, wird ein Warnfeld angezeigt und der Rückgabewert der Funktion ist falsch, andernfalls ist der Rückgabewert der Funktion wahr (was bedeutet, dass kein Problem mit den Daten vorliegt):

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-Bestätigung

Die folgende Funktion prüft, ob die eingegebenen Daten der grundlegenden Syntax einer E-Mail-Adresse entsprechen.

Das bedeutet, dass die Eingabedaten das @-Symbol und den Punkt (.) enthalten müssen. Gleichzeitig darf @ nicht das erste Zeichen der E-Mail-Adresse sein und nach @ muss mindestens ein Punkt 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

Hier ist der vollständige Code zusammen mit dem HTML-Formular:





Email:
Nach dem Login kopieren

Der obige Code ist der Benutzername, das Passwort, die erforderlichen Felder, die erforderlichen Optionen und die E-Mail-Adresse sowie der Code des Formulars. Ich hoffe, dass er für alle hilfreich ist, um die Javascript-Formularüberprüfung zu lernen.

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