Maison >interface Web >js tutoriel >validation de formulaire javascript compétences encyclopedia_javascript

validation de formulaire javascript compétences encyclopedia_javascript

WBOYoriginal: 2016-05-16 15:45:431333parcourir

Les données de formulaire typiques validées par JavaScript sont les suivantes :

1. L'utilisateur a-t-il rempli les éléments requis dans le formulaire ?

2. L'adresse e-mail saisie par l'utilisateur est-elle légale ?

3. L'utilisateur a-t-il saisi une date légale ?

4. L'utilisateur a-t-il saisi du texte dans le champ numérique ?

Voici le code de vérification du nom d'utilisateur et du mot de passe :

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

Vérification de l'article obligatoire (ou obligatoire) :

La fonction suivante permet de vérifier si l'utilisateur a rempli les éléments requis (ou obligatoires) dans le formulaire. Si requis ou si le champ requis est vide, une boîte d'avertissement apparaîtra et la valeur de retour de la fonction est fausse, sinon la valeur de retour de la fonction est vraie (ce qui signifie qu'il n'y a pas de problème avec les données) :

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

Voici le code ainsi que le formulaire HTML :

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

Vérification des e-mails

La fonction ci-dessous vérifie si les données saisies sont conformes à la syntaxe de base d'une adresse email.

Cela signifie que les données d'entrée doivent contenir le symbole @ et le point (.). En même temps, @ ne peut pas être le premier caractère de l'adresse email, et il doit y avoir au moins un point après @ :

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

Voici le code complet ainsi que le formulaire HTML :







Email:

Le code ci-dessus est le nom d'utilisateur, le mot de passe, les champs obligatoires, les options obligatoires et l'e-mail, ainsi que le code du formulaire. J'espère qu'il sera utile à tout le monde d'apprendre la vérification du formulaire javascript.

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Méthodes JavaScript pour ajouter, supprimer et trier des données dans des listes déroulantes_compétences JavascriptArticle suivant：Méthodes JavaScript pour ajouter, supprimer et trier des données dans des listes déroulantes_compétences Javascript

Articles Liés

Voir plus