30 lines
1.2 KiB
JavaScript
30 lines
1.2 KiB
JavaScript
document.getElementById("email").addEventListener("keyup", function() {
|
|
var password = this.value;
|
|
var strengthStatus = document.getElementById("password-strength-status");
|
|
var colorClass = '';
|
|
|
|
console.log("Password input:", password); // Menambahkan log untuk debug
|
|
|
|
// Regex untuk memeriksa kriteria kata sandi
|
|
var hasUpper = /[A-Z]/.test(password); // Memeriksa huruf besar
|
|
var hasLower = /[a-z]/.test(password); // Memeriksa huruf kecil
|
|
var hasNumber = /\d/.test(password); // Memeriksa angka
|
|
var hasSymbol = /[!@#$%^&*(),.?":{}|<>]/.test(password); // Memeriksa simbol
|
|
|
|
// Cek apakah kata sandi memenuhi semua kriteria
|
|
if (hasUpper && hasLower && hasNumber && hasSymbol) {
|
|
strengthStatus.textContent = 'Kata sandi valid';
|
|
colorClass = 'valid'; // Jika valid, set warna hijau
|
|
} else {
|
|
strengthStatus.textContent = 'Kata sandi tidak memenuhi syarat';
|
|
colorClass = 'invalid'; // Jika tidak memenuhi syarat, set warna merah
|
|
}
|
|
|
|
// Ubah warna input dan border sesuai dengan status
|
|
this.classList.remove("invalid", "valid");
|
|
this.classList.add(colorClass);
|
|
|
|
// Set warna indikator kekuatan
|
|
strengthStatus.className = colorClass;
|
|
});
|