Maison > interface Web > js tutoriel > Compétences en code_javascript pour la mise en œuvre de la validation des formulaires JavaScript

Compétences en code_javascript pour la mise en œuvre de la validation des formulaires JavaScript

Y2J
Libérer: 2017-05-23 13:22:41
original
1702 Les gens l'ont consulté

Cet article présente principalement en détail le code d'implémentation de la vérification du formulaire JavaScript, qui a une certaine valeur de référence. Les amis intéressés peuvent s'y référer

JavaScript peut être utilisé pour traiter les données avant qu'elles ne soient envoyées au serveur. . Validez ces données d'entrée dans le formulaire HTML

Validation du formulaire JavaScript

JavaScript peut être utilisé pour valider ces données d'entrée dans le formulaire HTML avant que les données ne soient envoyées. envoyé au serveur. Entrez les données à vérifier.
Ces données de formulaire typiques vérifiées par JavaScript sont :
L'utilisateur a-t-il rempli les champs obligatoires dans le formulaire ?
L'adresse e-mail saisie par l'utilisateur est-elle légale ?
L'utilisateur a-t-il saisi une date valide ?
L'utilisateur a-t-il saisi du texte dans le champ numérique ?

Éléments obligatoires (ou obligatoires)

La fonction suivante est utilisée pour vérifier si l'utilisateur a rempli les champs obligatoires (ou obligatoires) sous la forme Sélectionner) projet. Si le champ obligatoire ou le champ obligatoire est vide, alors la 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}
}
}
Copier après la connexion

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>
Copier après la connexion

Validation de l'e-mail

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 saisies doivent contenir le symbole @ et le point (.). En même temps, @ ne peut pas être le premier caractère de l'adresse e-mail, 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}
}
}
Copier après la connexion

Ce qui suit est le complet codez avec le formulaire HTML :






Email:
Copier après la connexion

[Recommandations associées]

1 Tutoriel vidéo gratuit Javascript

2. Explication détaillée des exemples distants de boîte modale bootstrap

3 Explication détaillée des exemples d'implémentation de l'effet de défilement de chapiteau

. 4. Production JS de l'affichage des messages de chat QQ et exemple de code de la fonction de soumission de commentaires

5 Une seule ligne de JS pour implémenter la vérification du format d'argent mobile

.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal