Memvalidasi email di sisi klien memberi umpan balik cepat sebelum form dikirim, meningkatkan pengalaman pengguna. Artikel ini membahas cara memvalidasi alamat email di JavaScript.
Menggunakan Regular Expression
<script>
function emailValid(email) {
const pola = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return pola.test(email);
}
console.log(emailValid("budi@mail.com")); // true
console.log(emailValid("salah@")); // false
</script>
Contoh Kasus: Validasi Real-time saat Mengetik
<script>
const input = document.getElementById("email");
input.addEventListener("input", function() {
if (emailValid(input.value)) {
input.style.borderColor = "green";
} else {
input.style.borderColor = "red";
}
});
</script>
Alternatif: Validasi Bawaan HTML5
<input type="email" required>
Atribut type="email" memberi validasi dasar tanpa JavaScript sama sekali.
Peringatan Penting
Validasi di sisi klien hanya untuk kenyamanan. Anda wajib memvalidasi ulang di server, karena JavaScript bisa dinonaktifkan atau dilewati oleh penyerang.
Kesimpulan
Gunakan regex sederhana atau type="email" untuk validasi email di sisi klien sebagai umpan balik awal. Namun jangan pernah menjadikannya satu-satunya lapisan — validasi ulang di server selalu wajib.
Referensi: untuk penjelasan lebih mendalam, kunjungi dokumentasi resmi JavaScript (MDN).

