Le plug-in de validation du formulaire jQuery Validate ajoute une vérification sous la forme d'un attribut de classe

Le plug-in de validation du formulaire jQuery Validate ajoute une vérification sous la forme d'un attribut de classe_jquery

WBOY

Libérer： 2016-05-16 15:19:35

original

1598 Les gens l'ont consulté

L'exemple de cet article présente le plug-in de vérification de formulaire jQuery Validate, ajoutant une vérification sous forme d'attributs de classe et le partage avec tout le monde pour votre référence. Le contenu spécifique est le suivant
. L'effet est le suivant :

1. Plug-in de validation de formulaire jQuery, ajoutez une vérification sous forme d'attribut de classe

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery表单验证插件----添加class属性形式的校验</title>
 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script src="lib/jquery.validate.js" type="text/javascript"></script>
<style type="text/css">
* { font-family: Verdana; font-size: 96%; }
label { width: 10em; float: left; }
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; }
p { clear: both; }
.submit { margin-left: 12em; }
em { font-weight: bold; padding-right: 1em; vertical-align: top; }
</style>
 <script type="text/javascript">
 $(document).ready(function(){
  $("#commentForm").validate();
 });
 </script>
 
</head>
<body>
 

 <form class="cmxform" id="commentForm" method="get" action="">
 <fieldset>
  <legend>jQuery表单验证插件----添加class属性形式的校验</legend>
  <p>
   <label for="cusername">姓名</label>
   <em>*</em><input id="cusername" name="username" size="25" class="required" minlength="2" />
  </p>
  <p>
   <label for="cemail">电子邮件</label>
   <em>*</em><input id="cemail" name="email" size="25" class="required email" />
  </p>
  <p>
   <label for="curl">网址</label>
   <em> </em><input id="curl" name="url" size="25" class="url" value="" />
  </p>
  <p>
   <label for="ccomment">你的评论</label>
   <em>*</em><textarea id="ccomment" name="comment" cols="22" class="required"></textarea>
  </p>
  <p>
   <input class="submit" type="submit" value="提交"/>
  </p>
 </fieldset>
 </form>
</body>
</html>

Copier après la connexion

2. Règles par défaut
Règles de vérification par défaut :

(1)obligatoire : vrai Champs obligatoires
(2)remote :"check.php" Utilisez la méthode ajax pour appeler check.php pour vérifier la valeur d'entrée
(3)email:true Vous devez saisir un email au bon format
(4)url:true Vous devez saisir l'URL dans le bon format
(5)date:true Vous devez saisir la date dans le bon format Il y a une erreur dans la vérification de la date ie6, à utiliser avec prudence
.
(6)dateISO:true Vous devez saisir la date (ISO) au bon format, par exemple : 2009-06-23, 1998/01/22 Seul le format est vérifié, pas le validité
(7)number:true Vous devez saisir un numéro légal (nombre négatif, décimal)
(8)chiffres:true Vous devez saisir un entier
(9)carte de crédit : Vous devez saisir un numéro de carte de crédit légal
(10)equalTo:"#field" La valeur d'entrée doit être la même que #field
(12)maxlength:5 Saisissez une chaîne d'une longueur maximale de 5 (les caractères chinois comptent pour un caractère)
(13)minlength:10 Saisissez une chaîne d'une longueur minimale de 10 (les caractères chinois comptent pour un caractère)
(14)rangelength :[5,10] La longueur saisie doit être une chaîne comprise entre 5 et 10") (les caractères chinois comptent pour un caractère)
(15)plage :[5,10] La valeur d'entrée doit être comprise entre 5 et 10
(16)max:5
(17)min:10 La valeur d'entrée ne peut pas être inférieure à 10
Invite par défaut :

Ce qui précède représente l’intégralité du contenu de cet article, j’espère qu’il sera utile à l’étude de chacun.