Rumah > hujung hadapan web > tutorial js > Pemalam jQuery Validate melaksanakan validation_jquery borang tersuai

Pemalam jQuery Validate melaksanakan validation_jquery borang tersuai

WBOY
Lepaskan: 2016-05-16 15:19:29
asal
1324 orang telah melayarinya

Artikel ini menerangkan pemalam pengesahan borang jQuery Validate dalam contoh, cara menyesuaikan kaedah pengesahan dan berkongsinya dengan semua orang untuk rujukan anda Kandungan khusus adalah seperti berikut

Kesannya adalah seperti berikut:

Kesan kegagalan pengesahan:

Kesan kejayaan pengesahan:

Langkah khusus:

1. Memperkenalkan pakej pergantungan

 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script src="lib/jquery.validate.js" type="text/javascript"></script>
Salin selepas log masuk

2. Tambahkan gaya ralat dan gaya kejayaan

 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;
}
Salin selepas log masuk

3 Sesuaikan kaedah pengesahan

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

4. Paparan gaya panggilan

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

5. Kod terperinci adalah seperti berikut

 


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

Salin selepas log masuk

Di atas adalah keseluruhan kandungan artikel ini, saya harap ia akan membantu semua orang dalam mempelajari pengesahan borang.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan