jQuery formValidator formulaire validation_jquery
作为一名程序员，在解决工作中遇到问题之后，做一些总结是有必要的，既方便总结温习相关知识点，也为广大的程序员提供了一些工作经历，给予同行一面明鉴.
html部分：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>formValidator</title>
<script src="js/jquery-1.11.1.js"></script>
<script src="js/formValidator-4.0.1.min.js"></script>
<script src="js/DateTimeMask.js"></script>
<script src="js/formValidatorRegex.js"></script>
<link rel="stylesheet" href="css/validator.css">
<style>
form{
width: 500px;
margin: 100px auto;
}
table tr td:first-child{
text-align: right;
}
table tr td{
padding: 5px 0;
}
div{
margin-left: 10px;
padding: 0 10px;
}
</style>
</head>
<body>
<form name="myfm" id="myfm" action="1.html">
<table>
<tbody>
<tr>
<td><label for="uname">用户名：</label></td>
<td><input type="text" id="uname" name="uname"/></td>
<td><div id="unameTip"></div></td>
</tr>
<tr>
<td><label for="pwd">密码：</label></td>
<td><input type="password" id="pwd" name="pwd"/></td>
<td><div id="pwdTip"></div></td>
</tr>
<tr>
<td><label for="repwd">重复密码：</label></td>
<td><input type="password" name="repwd" id="repwd"/></td>
<td><div id="repwdTip"></div></td>
</tr>
<tr>
<td><label>性别：</label></td>
<td>
<input type="radio" name="sex" value="male" id="male"/>
<label for="male">男</label>
<input type="radio" name="sex" value="female" id="female"/>
<label for="female">女</label>
</td>
</tr>
<tr>
<td><label for="area">地区：</label></td>
<td>
<select name="area" id="area">
<option value="0">- 请选择 -</option>
<option value="1">锦江区</option>
<option value="2">金牛区</option>
<option value="3">龙泉驿区</option>
<option value="4">青羊区</option>
</select>
</td>
</tr>
<tr>
<td><label for="num">身份证：</label></td>
<td><input type="text" id="num" name="num"/></td>
<td><div id="numTip"></div></td>
</tr>
<tr>
<td><label for="phone">电话号码：</label></td>
<td><input type="text" name="phone" id="phone"/></td>
<td><div id="phoneTip"></div></td>
</tr>
<tr>
<td><label for="email">邮箱：</label></td>
<td><input type="text" name="email" id="email"/></td>
<td><div id="emailTip"></div></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="submit" id="submit" value="提交"/></td>
<td></td>
</tr>
</tbody>
</table>
</form>
<script>
$.formValidator.initConfig({ //用于配置当前formValidator插件
formID:"myfm",
debug:false,
submitOnce:true,
validatorGroup : '1', //设置验证组，默认值为1
onSuccess : function(){ //验证成功后的回调函数
},
onError:function(){ //验证失败后的回调函数
}
});
$('#uname').formValidator({
ValidatorGroup : '1', //验证组为1
onEmpty : '用户名不能为空', //提示用户名不能为空
onShow : "",
onFocus : '用户名必须为1到12位的数字或字母',//表单元素获得焦点的时候提示应输入的格式
onCorrect : '用户名输入正确' //输入正确的提示
})
.regexValidator({
regExp : '^[0-9a-zA-Z]{1,12}$', //验证表单输入的正则表达式
onError : '用户名格式有误，请从新输入' //输入错误的提示
})
.ajaxValidator({ //验证输入的用户名是否已经存在
dataType : 'html', //请求数据的格式
async : true, //异步方式
url : 'test.php',
success : function(data){
if (data=='false') {
return false;
}else{
return true;
}
},
onError : '该用户名已存在，请从新输入',
onWait : '正在对用户名进行合法性校验，请稍候...'
});
$('#pwd').formValidator({
ValidatorGroup : '1',
onEmpty : '密码不能为空',
onShow : "",
onFocus : '密码必须为6位以上的字母或数字',
onCorrect : '密码输入正确'
})
.regexValidator({
regExp : '[0-9a-zA-Z]{6,}',
onError : '密码格式有误，请从新输入'
});
$('#repwd').formValidator({
ValidatorGroup : '1',
onEmpty : '密码不能为空',
onShow : "",
onFocus : '密码必须为6位以上的字母或数字',
onCorrect : '密码输入正确'
})
.regexValidator({
regExp : '^[0-9a-zA-Z]{6,}$',
onError : '密码格式不正确'
})
.compareValidator({ //比较两次输入内容是否符合下面给出的比较符号
desID : 'pwd', //相比较的表单元素的ID值
operateor : '=', //要比较的两个元素之间的关系
onError : '两次密码输入不一致，请从新输入' //不满足以上关系的时候的提示
});
$('#num').formValidator({
ValidatorGroup : '1',
onEmpty : '身份证不能为空',
onShow : '',
onFocus : '请输入您的身份证号',
onCorrect : '身份证格式正确'
}).regexValidator({
regExp : '^[1-9]\\d{5}[1-9]\\d{3}((0\\d)|(1[0-2]))(([0|1|2]\\d)|3[0-1])\\d{4}$',
//15位身份证号码的正则表达式/^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/
onError : '身份证格式有误，请从新输入'
});
$('#phone').formValidator({
ValidatorGroup : '1',
onEmpty : '手机号码不能为空',
onShow : '',
onFocus : '请输入您的手机号码',
onCorrect : '手机号码格式正确',
})
.regexValidator({
regExp : '^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$',
onError : '手机号码格式有误，请从新输入'
});
$('#email').formValidator({
ValidatorGroup : '1',
onEmpty : '邮箱地址不能为空',
onShow : '',
onFocus : '请输入您的邮箱地址',
onCorrect : '邮箱格式正确'
})
.regexValidator({
regExp : '^\\w+([-+.]\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$',
onError : '邮箱格式有误，请从新输入'
});
</script>
</body>
</html>
php部分代码：
<?php
header('Content-Type:html');
$name=array('Tom','ervin','Jhon');
$uname=$_REQUEST['uname'];
$notexit='true';
for ($i=0; $i <3 ; $i++) {
if ($uname==$name[$i]) {
$notexit='false';
break;
}else{
}
}
echo "$notexit";
?>以上内容是小编给大家介绍的jQuery formValidator表单验证相关知识，希望对大家有所帮助，同时感谢大家对脚本之家网站的支持。
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Que dois-je faire si je rencontre l'impression de code brouillé pour les reçus en papier thermique frontal?
Apr 04, 2025 pm 02:42 PM
Des questions et des solutions fréquemment posées pour l'impression de billets thermiques frontaux pour le développement frontal, l'impression de billets est une exigence commune. Cependant, de nombreux développeurs mettent en œuvre ...
Qui est payé plus de python ou de javascript?
Apr 04, 2025 am 12:09 AM
Il n'y a pas de salaire absolu pour les développeurs Python et JavaScript, selon les compétences et les besoins de l'industrie. 1. Python peut être davantage payé en science des données et en apprentissage automatique. 2. JavaScript a une grande demande dans le développement frontal et complet, et son salaire est également considérable. 3. Les facteurs d'influence comprennent l'expérience, la localisation géographique, la taille de l'entreprise et les compétences spécifiques.
Démystifier javascript: ce qu'il fait et pourquoi c'est important
Apr 09, 2025 am 12:07 AM
JavaScript est la pierre angulaire du développement Web moderne, et ses principales fonctions incluent la programmation axée sur les événements, la génération de contenu dynamique et la programmation asynchrone. 1) La programmation axée sur les événements permet aux pages Web de changer dynamiquement en fonction des opérations utilisateur. 2) La génération de contenu dynamique permet d'ajuster le contenu de la page en fonction des conditions. 3) La programmation asynchrone garantit que l'interface utilisateur n'est pas bloquée. JavaScript est largement utilisé dans l'interaction Web, les applications à une page et le développement côté serveur, améliorant considérablement la flexibilité de l'expérience utilisateur et du développement multiplateforme.
Comment fusionner les éléments du tableau avec le même ID dans un seul objet en utilisant JavaScript?
Apr 04, 2025 pm 05:09 PM
Comment fusionner les éléments du tableau avec le même ID dans un seul objet en JavaScript? Lors du traitement des données, nous rencontrons souvent la nécessité d'avoir le même ID ...
Comment réaliser des effets de défilement de parallaxe et d'animation des éléments, comme le site officiel de Shiseido?
ou:
Comment pouvons-nous réaliser l'effet d'animation accompagné d'un défilement de page comme le site officiel de Shiseido?
Apr 04, 2025 pm 05:36 PM
La discussion sur la réalisation des effets de défilement de parallaxe et d'animation des éléments dans cet article explorera comment réaliser le site officiel de Shiseido (https://www.shiseido.co.jp/sb/wonderland/) ...
La différence dans Console.Log de sortie Résultat: Pourquoi les deux appels sont-ils différents?
Apr 04, 2025 pm 05:12 PM
Discussion approfondie des causes profondes de la différence de sortie Console.log. Cet article analysera les différences dans les résultats de sortie de la fonction Console.log dans un morceau de code et expliquera les raisons derrière. � ...
JavaScript est-il difficile à apprendre?
Apr 03, 2025 am 12:20 AM
Apprendre JavaScript n'est pas difficile, mais c'est difficile. 1) Comprendre les concepts de base tels que les variables, les types de données, les fonctions, etc. 2) Master la programmation asynchrone et les implémenter via des boucles d'événements. 3) Utilisez les opérations DOM et promettez de gérer les demandes asynchrones. 4) Évitez les erreurs courantes et utilisez des techniques de débogage. 5) Optimiser les performances et suivre les meilleures pratiques.
PowerPoint peut-il exécuter JavaScript?
Apr 01, 2025 pm 05:17 PM
JavaScript peut être exécuté dans PowerPoint et peut être implémenté en appelant des fichiers JavaScript externes ou en intégrant des fichiers HTML via VBA. 1. Pour utiliser VBA pour appeler les fichiers JavaScript, vous devez activer les macros et avoir des connaissances en programmation VBA. 2. ENCHED des fichiers HTML contenant JavaScript, qui sont simples et faciles à utiliser mais sont soumis à des restrictions de sécurité. Les avantages incluent les fonctions étendues et la flexibilité, tandis que les inconvénients impliquent la sécurité, la compatibilité et la complexité. En pratique, l'attention doit être accordée à la sécurité, à la compatibilité, aux performances et à l'expérience utilisateur.
