Laksanakan pengesahan dan gesaan data borang dalam JavaScript

Dengan pembangunan Internet yang berterusan, borang telah menjadi bahagian yang amat diperlukan pada halaman, dan dalam proses input borang, pengesahan data merupakan pautan yang sangat diperlukan. Dalam keadaan biasa, kami akan melaksanakan pengesahan dan gesaan data borang melalui pengesahan bahagian belakang, tetapi jika kami boleh melakukannya di bahagian hadapan, kami boleh memberikan pengguna pengalaman yang lebih baik. Artikel ini akan memperkenalkan cara melaksanakan pengesahan dan gesaan data borang dalam JavaScript.

1. Pengesahan borang JavaScript asli

JavaScript menyediakan beberapa kaedah dan sifat terbina dalam untuk mengesahkan borang. Sebagai contoh, medan yang diperlukan dalam borang boleh disahkan dengan menggunakan atribut yang diperlukan dalam HTML5. Atribut yang diperlukan menghalang pengguna daripada menyerahkan borang apabila mereka terlupa mengisi maklumat ini. Tetapi sedar bahawa atribut ini tidak dapat mengesahkan sama ada kandungan input memenuhi keperluan.

Kaedah lain ialah menggunakan atribut jenis elemen input. Sebagai contoh, gunakan atribut type="email" untuk mengesahkan bahawa alamat e-mel yang dimasukkan adalah yang sah. Kaedah ini mempunyai had tertentu, tetapi ia masih berkesan untuk pengesahan bentuk asas.

2. Gunakan pemalam JavaScript

Selain JavaScript asli, terdapat banyak pemalam JavaScript yang sangat baik yang boleh membantu kami melaksanakan pengesahan borang. Antaranya, sesetengah pemalam hanya perlu menambah kod JavaScript mudah untuk melaksanakan fungsi pengesahan dan gesaan dalam borang.

Sebagai contoh, pemalam Pengesahan jQuery ialah pemalam JavaScript yang digunakan secara meluas yang memudahkan untuk mengesahkan input borang. Pemalam menyediakan banyak peraturan dan kaedah yang dipratentukan untuk mengesahkan jenis data seperti e-mel, kata laluan, URL dan banyak lagi. Dalam penggunaan sebenar, kami boleh memilih dan menyesuaikan mengikut keperluan input khusus dalam borang.

Bootstrap Validator ialah satu lagi pemalam JavaScript popular yang memudahkan untuk melaksanakan pengesahan borang menggunakan pengesah dan komponen gesaan ralat yang disediakannya.

3. Pengesahan borang JavaScript tersuai

Akhir sekali, kami juga boleh menulis kod JavaScript kami sendiri untuk melaksanakan pengesahan borang, yang sangat berguna untuk fungsi pengesahan tersuai. Kami boleh menggunakan ungkapan biasa JavaScript untuk melaksanakan pengesahan borang tertentu.

Sebagai contoh, apabila anda perlu mengesahkan sama ada input kata laluan memenuhi keperluan, anda boleh menulis kod JavaScript berikut:

function validatePassword(password) {
  const pattern = /^(?=.*d)(?=.*[a-z])(?=.*[A-Z]).{8,}$/;
  return pattern.test(password);
}

Dalam kod di atas, kami menggunakan ungkapan biasa untuk mengesahkan sama ada input kata laluan memenuhi keperluan berikut:

• mesti mengandungi sekurang-kurangnya 8 aksara; satu huruf kecil;
• mesti mengandungi sekurang-kurangnya satu huruf besar.
• Jika input memenuhi keperluan, fungsi akan kembali benar, jika tidak ia akan kembali palsu.
• Kesimpulan

Dalam artikel ini, kami memperkenalkan tiga kaedah biasa untuk melaksanakan pengesahan data borang dan gesaan dalam JavaScript. JavaScript asli menyediakan atribut dan kaedah HTML5 yang mudah; pemalam JavaScript menyediakan fungsi dan pilihan yang lebih kaya, dan boleh disesuaikan mengikut keperluan, akhirnya, kami boleh menggunakan ungkapan biasa JavaScript dan fungsi tersuai untuk mencapai keperluan pengesahan tertentu

Tidak kira kaedah mana yang digunakan, pengesahan borang adalah langkah penting untuk memastikan keselamatan dan ketepatan data input pengguna, dan harus diambil serius.

Atas ialah kandungan terperinci Laksanakan pengesahan dan gesaan data borang dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!