Maison  >  Article  >  interface Web  >  Exemple de fonction de validation de formulaire simple implémentée en JS

Exemple de fonction de validation de formulaire simple implémentée en JS

韦小宝
韦小宝original
2018-01-12 09:57:471694parcourir

Cet article présente principalement la fonction simple de vérification de formulaire implémentée par JS, impliquant l'acquisition, le jugement, la définition de la concentration et d'autres compétences opérationnelles connexes pour le contenu de soumission de formulaire. Les amis intéressés par js peuvent se référer au . suivant Cet article

L'exemple de cet article décrit la fonction simple de validation de formulaire implémentée par JS. Partagez-le avec tout le monde pour votre référence, comme suit :

Code source :

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="myjs1.js"></script>
<link rel="stylesheet" type="text/css" href="myfile-2.css" rel="external nofollow" />
</head>
<body>
<form name="f1">
姓名:<input type="text" name="xm" />
<br/>
年龄:<input type="text" name="nl" />
爱好:<input type= "checkbox" name="ah" />爬山
<input type= "checkbox" name="ah" />游泳
<input type= "checkbox" name="ah" />网球
<input type= "checkbox" name="ah" />乒乓球
<br/>
密码:<input type="password" name="mm"/>
<br/>
重复密码:<input type="password" name="cfmm"/>
<br/>
备注:<textarea name="bz" rows="10" cols="20"></textarea>
<br/>
<input type="button" value="提交" onclick="checkit();"/>
</form>
</body>
</html>

Code du fichier myjs1.js :

// JavaScript Document
function checkit()
{ var flag = false;
 for(var i=0;i<document.forms[0].ah.length;i++)
{
if(document.forms[0].ah[i].checked)//checked 表示被选中
{
flag = true;
break;
}
}
if(!flag)//没有一个爱好被选中
{
alert("请至少选择一个爱好!");
return;//假如没有找到,又返回去,直到找到!
}
if(document.forms[0].mm.value.length<9)
{
alert("密码长度必须在8位数以上!");
document.forms[0].mm.focus();//让密码框获取焦点,焦点是 可以根据应用配合完成一些自动化操作,比如登录时输入了错误的用户名和密码,回转登录页后,可以让用户名输入框自动获得焦点,避免用户重新定位。
return;
}
if(document.forms[0].mm.value!=document.forms[0].cfmm.value)
{
alert("两次密码输入不一致,请重新输入密码!");
return;
}
if(document.forms[0].bz.value=="")
{
alert("请输入备注!");
}
}

Remarque : utilisez var pour déclarer des variables dans js, définissez des fonctions, utilisez une fonction,

Cet exemple peut implémenter une vérification de passe-temps (ne peut pas être vide ), si le mot de passe est cohérent, et si la longueur du mot de passe doit être supérieure à 8, et si la remarque est vide De plus, le fichier css est laissé au lecteur pour l'embellir~

Recommandations associées ! :

Résoudre Extjs Solution au problème selon lequel les images téléchargées ne peuvent pas être prévisualisées_extjs

Les restrictions JS avant de télécharger des images incluent (jpg jpg gif et taille, hauteur et largeur ), etc.

Exemple de prévisualisation d'images avant le téléchargement JS

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!

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