Das Formularvalidierungs-Plug-in jQuery Validate fügt eine Überprüfung in Form der Klasse attribute

Das Formularvalidierungs-Plug-in jQuery Validate fügt eine Überprüfung in Form der Klasse attribute_jquery hinzu

WBOY

Freigeben： 2016-05-16 15:19:35

Original

1564 Leute haben es durchsucht

Das Beispiel in diesem Artikel stellt das jQuery Validate-Formularüberprüfungs-Plug-in vor, fügt die Überprüfung in Form von Klassenattributen hinzu und teilt es als Referenz mit allen. Der spezifische Inhalt ist wie folgt.
Der Effekt ist wie folgt:

1. jQuery-Formularvalidierungs-Plug-in, Überprüfung in Form von Klassenattributen hinzufügen

<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>

Nach dem Login kopieren

2. Standardregeln
Standardverifizierungsregeln:

(1)required:true Erforderliche Felder
(2)remote:"check.php" Verwenden Sie die Ajax-Methode, um check.php aufzurufen, um den Eingabewert zu überprüfen
(3)email:true Sie müssen eine E-Mail im richtigen Format eingeben
(4)url:true Sie müssen die URL im richtigen Format eingeben
(5)date:true Sie müssen das Datum im richtigen Format eingeben. Es liegt ein Fehler bei der Datumsüberprüfung vor, dh6, verwenden Sie es mit Vorsicht
(6)dateISO:true Sie müssen das Datum (ISO) im richtigen Format eingeben, zum Beispiel: 23.06.2009, 22.01.1998 Nur das Format wird überprüft, nicht das Gültigkeit
(7)number:true Sie müssen eine gültige Zahl eingeben (negative Zahl, Dezimalzahl)
(8)digits:true Sie müssen eine Ganzzahl eingeben
(9)Kreditkarte: Sie müssen eine gültige Kreditkartennummer eingeben
(10)equalTo:"#field" Der Eingabewert muss mit #field
identisch sein
(12)maxlength:5 Geben Sie eine Zeichenfolge mit einer maximalen Länge von 5 ein (chinesische Zeichen zählen als ein Zeichen)
(13)minlength:10 Geben Sie eine Zeichenfolge mit einer Mindestlänge von 10 ein (chinesische Zeichen zählen als ein Zeichen)
(14)rangelength:[5,10] Die Eingabelänge muss eine Zeichenfolge zwischen 5 und 10 Zoll sein (chinesische Zeichen zählen als ein Zeichen)
(15)range:[5,10] Der Eingabewert muss zwischen 5 und 10 liegen
(16)max:5
(17)min:10 Der Eingabewert darf nicht kleiner als 10 sein
Standardaufforderung:

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein.