Heim > Web-Frontend > js-Tutorial > Hauptteil

Das jQuery-Plug-in Validate implementiert das benutzerdefinierte Formular validation_jquery

WBOY
Freigeben: 2016-05-16 15:19:29
Original
1303 Leute haben es durchsucht

In diesem Artikel wird das jQuery Validate-Formularüberprüfungs-Plug-in anhand eines Beispiels erläutert, wie eine Überprüfungsmethode angepasst wird, und es wird allen als Referenz zur Verfügung gestellt. Der spezifische Inhalt ist wie folgt

Die Wirkung ist wie folgt:

Auswirkung des Überprüfungsfehlers:

Verifizierungserfolgseffekt:

Spezifische Schritte:

1. Abhängigkeitspakete einführen

 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script src="lib/jquery.validate.js" type="text/javascript"></script>
Nach dem Login kopieren

2. Fehlerstil und Erfolgsstil hinzufügen

 em { font-weight: bold; padding-right: 1em; vertical-align: top; }
em.error {
 background:url("images/unchecked.gif") no-repeat 0px 0px;
 padding-left: 16px;
}
em.success {
 background:url("images/checked.gif") no-repeat 0px 0px;
 padding-left: 16px;
}
Nach dem Login kopieren

3. Passen Sie eine Verifizierungsmethode an

 //自定义一个验证方法
 $.validator.addMethod(
 "formula", //验证方法名称
 function(value, element, param) {//验证规则
  return value == eval(param);
 }, 
 '请正确输入数学公式计算后的结果'//验证提示信息
 );
Nach dem Login kopieren

4. Anzeige des Anrufstils

 errorElement: "em",    //用来创建错误提示信息标签
  success: function(label) {   //验证成功后的执行的回调函数
   //label指向上面那个错误提示信息标签em
   label.text(" ")    //清空错误提示消息
    .addClass("success"); //加上自定义的success类
  }
Nach dem Login kopieren

5. Der detaillierte Code lautet wie folgt

 


jQuery表单验证插件----自定义一个验证方法
 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script src="lib/jquery.validate.js" type="text/javascript"></script>


 
 

jQuery表单验证插件----自定义一个验证方法

*

*

*

=7+9

Nach dem Login kopieren

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er für alle beim Erlernen der Formularüberprüfung hilfreich ist.

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage