Bagaimana untuk menulis pengesahan borang jquery

Dalam pembangunan bahagian hadapan, pengesahan borang ialah kemahiran penting. Pengesahan borang boleh memastikan ketepatan dan kesahihan data yang dimasukkan oleh pengguna, dengan berkesan mengurangkan kebarangkalian ralat data dan membawa pengalaman yang baik kepada pengguna. Artikel ini akan memperkenalkan cara menggunakan jQuery untuk mengesahkan borang.

Rangka kerja dan pemalam

Apabila menggunakan jQuery untuk mengesahkan borang, kita boleh memilih untuk menggunakan beberapa rangka kerja dan pemalam yang sangat baik untuk meningkatkan kecekapan pembangunan dan kualiti kod. Rangka kerja pengesahan borang biasa dan pemalam ialah:

1. Pengesahan jQuery
   Pengesahan jQuery ialah pemalam pengesahan borang yang sangat popular, yang boleh mengesahkan data dalam borang secara automatik melalui tetapan dan prinsip mudah . Selain itu, Pengesahan jQuery menyokong pelbagai jenis pengesahan, termasuk medan yang diperlukan, panjang minimum, panjang maksimum, ungkapan biasa, pengesahan jauh, dsb.
2. Bootstrap Validator
   Bootstrap Validator ialah pemalam pengesahan borang berdasarkan Bootstrap dan jQuery. Ia menyediakan pelbagai kaedah pengesahan, termasuk medan yang diperlukan, e-mel, kata laluan, nombor telefon mudah alih, alamat URL, dsb., dan menyokong peraturan pengesahan tersuai.
3. FormValidation
   FormValidation ialah rangka kerja pengesahan borang yang popular Ia dicirikan dengan menyepadukan perpustakaan dan rangka kerja JavaScript yang berbeza, seperti Bootstrap dan Foundation. FormValidation menyokong mesej ralat tersuai, pengesahan tak segerak, kaedah pengesahan yang mudah dan peraturan pengesahan berbilang.

Tiga rangka kerja dan pemalam di atas adalah mudah untuk digunakan, fleksibel dan boleh diubah serta patut mendapat perhatian pembangun.

Pelaksanaan pengesahan borang

Berikut akan mengambil pemalam Pengesahan jQuery sebagai contoh untuk memperkenalkan cara menggunakan jQuery untuk mengesahkan borang.

1. Memperkenalkan Pengesahan jQuery dan jQuery

Sebelum bermula, kami perlu memperkenalkan fail JavaScript yang diperlukan ke dalam fail HTML kami.

2. Menulis kod HTML

Dalam kod HTML, kita perlu terlebih dahulu mentakrifkan borang dan menambah ID unik pada setiap elemen borang.

 用户名: 
 密码: 
 电子邮件: 
 提交 

3. Tulis kod JavaScript

Dalam kod JavaScript, kita perlu mengkonfigurasi peraturan pengesahan dan mesej ralat dahulu, dan kemudian memanggil kaedah validate() untuk mengesahkan bentuk. Jika pengesahan borang berjaya, operasi yang sepadan boleh dilakukan, seperti menyerahkan borang.

$(document).ready(function() { $("#myform").validate({ rules: { username: { required: true, minlength: 6 }, password: { required: true, minlength: 8 }, email: { required: true, email: true } }, messages: { username: { required: "请输入用户名", minlength: "用户名长度必须大于等于6个字符" }, password: { required: "请输入密码", minlength: "密码长度必须大于等于8个字符" }, email: { required: "请输入电子邮件", email: "请正确填写有效的电子邮件地址" } }, submitHandler: function(form) { // 表单通过验证后执行的操作 form.submit(); } }); });

Dalam kod di atas, kami menggunakan kaedah validate() untuk mengesahkan borang, dengan atribut peraturan mentakrifkan peraturan pengesahan dan atribut mesej mentakrifkan mesej ralat yang sepadan. Apabila borang diserahkan, atribut submitHandler mencetuskan operasi yang berkaitan.

Perlu diambil perhatian bahawa apabila menggunakan Pengesahan jQuery untuk pengesahan borang, anda perlu memperkenalkan skrip Pengesahan jQuery dan jQuery ke dalam fail HTML terlebih dahulu, dan laksanakan kod selepas jQuery sedia. Selain itu, anda perlu menetapkan ID unik untuk setiap elemen borang untuk dikaitkan dengan peraturan pengesahan.

Ringkasan

Melalui artikel ini, kami mempelajari cara menggunakan pemalam Pengesahan jQuery untuk mengesahkan borang, serta rangka kerja dan pemalam pengesahan borang biasa. Dalam pembangunan sebenar, kita boleh memilih kaedah pengesahan borang yang sesuai mengikut situasi tertentu, dan menggunakan pelbagai peraturan pengesahan dan gesaan ralat untuk memastikan ketepatan dan keselamatan data borang.

Atas ialah kandungan terperinci Bagaimana untuk menulis pengesahan borang jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!