Rumah >hujung hadapan web >tutorial js >Bermula dengan penggunaan asas jquery validate form validation_jquery
1. Pengenalan kepada jQuery Validate plug-in
Pemalam jQuery Validate menyediakan fungsi pengesahan yang berkuasa untuk borang, menjadikan pengesahan borang sebelah pelanggan lebih mudah, sambil menyediakan sejumlah besar pilihan penyesuaian untuk memenuhi pelbagai keperluan aplikasi. Pemalam ini menggabungkan satu set kaedah pengesahan yang berguna, termasuk URL dan pengesahan e-mel, dan menyediakan API untuk menulis kaedah yang ditentukan pengguna. Semua kaedah yang digabungkan menggunakan bahasa Inggeris untuk mesej ralat secara lalai dan telah diterjemahkan ke dalam 37 bahasa lain.
Pemalam ini ditulis dan diselenggara oleh Jörn Zaefferer, ahli pasukan jQuery, pembangun utama dalam pasukan UI jQuery dan penyelenggara QUnit.
2. Pengenalan kepada ciri jQuery Validate
jQuery Validate mempunyai ciri-ciri berikut:
(1) Peraturan pengesahan terbina dalam;
Pemalam pengesahan borang jQuery yang berkuasa sesuai untuk pengesahan harian e-mel, nombor telefon, URL, dsb. dan pengesahan Ajax Selain peraturan pengesahannya sendiri, anda juga boleh menambah peraturan pengesahan tersuai.Serasi dengan IE 6, Chrome, Firefox, Safari, Opera 10
(2) Peraturan pengesahan tersuai;
(3) Gesaan maklumat yang ringkas dan berkuasa.
(4) Pengesahan masa nyata: Pengesahan dicetuskan melalui acara keyup atau kabur, bukan hanya selepas penyerahan.
3. Contoh mudah untuk mempelajari jQuery Valid
<script type="text/javascript" src="../../lib/jquery-1.11.1.js"></script> <script type="text/javascript" src="../../dist/jquery.validate.js"></script>
1. Gunakan pemalam untuk melakukan beberapa pengesahan mudah
jQuery PlugIn -一个简单带验证例子 <script type="text/javascript" src="../../lib/jquery-1.11.1.js"></script> <script type="text/javascript" src="../../dist/jquery.validate.js"></script> <script> $(document).ready(function(){ $("#commentForm").validate(); }); </script>
Penjelasan pengesahan di atas:
1) Mula-mula, anda perlu memperkenalkan jquery-1.11.1.js, kerana pemalam ini adalah berdasarkan JQuery.
2). Perkenalkan pemalam pengesahan jquery.validate.js.
3), memperkenalkan skrip penyetempatan segera. Untuk pengantarabangsaan maklumat pengesahan, gesaan pengesahan lalai adalah dalam bahasa Inggeris Pengantarabangsaan boleh dicapai dengan mengimport fail pengantarabangsaan yang telah ditulis melalui pengesahan. Tukar ralat/gaya paparan mesej yang betul.
4) Tambahkan jenis yang akan disahkan dalam atribut kelas kotak input. Untuk medan yang berbeza, kodkan peraturan pengesahan dan tetapkan atribut medan yang sepadan
(1)required:true 必输字段 (2)remote:"check.shtml" 使用ajax方法调用check.shtml验证输入值 (3)email:true 必须输入正确格式的电子邮件(只能验证格式,不保证有效性) (4)url:true 必须输入正确格式的网址 (5)date:true 必须输入正确格式的日期 (6)dateISO:true 必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22 只验证格式,不验证有效性 (7)number:true 必须输入合法的数字(负数,小数) (8)digits:true 必须输入整数 (9)creditcard: 必须输入合法的信用卡号 (10)equalTo:"#field" 输入值必须和#field相同 (11)accept: 输入拥有合法后缀名的字符串(上传文件的后缀) (12)maxlength:5 输入长度最多是5的字符串(汉字算一个字符) (13)minlength:10 输入长度最小是10的字符串(汉字算一个字符) (14)rangelength:[5,10] 输入长度必须介于 5 和 10 之间的字符串")(汉字算一个字符) (15)range:[5,10] 输入值必须介于 5 和 10 之间 (16)max:5 输入值不能大于5 (17)min:10 输入值不能小于10
<script type="text/javascript"> ////<![CDATA[ $(document).ready(function(){ $("#commentForm").validate(); }); //]]> </script>