Maison >interface Web >js tutoriel >Le plug-in de validation du formulaire jQuery Validate ajoute une vérification sous la forme d'un attribut de classe_jquery

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

WBOY
WBOYoriginal
2016-05-16 15:19:351611parcourir

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>


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
  • 3bb3ba5d8a8c1e677360c9d603cb067b

  • (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.

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