Heim >Web-Frontend >js-Tutorial >Javascript-Formularvalidierung Enzyklopädie_Javascript-Kenntnisse

Javascript-Formularvalidierung Enzyklopädie_Javascript-Kenntnisse

WBOYOriginal: 2016-05-16 15:45:431332Durchsuche

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>

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}
}
}

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>

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}
}
}

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







Email:

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.

Stellungnahme：

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

Vorheriger Artikel：JavaScript-Methoden zum Hinzufügen, Löschen und Sortieren von Daten in Dropdown-Listenfeldern_Javascript-KenntnisseNächster Artikel：JavaScript-Methoden zum Hinzufügen, Löschen und Sortieren von Daten in Dropdown-Listenfeldern_Javascript-Kenntnisse

In Verbindung stehende Artikel

Mehr sehen