Блог

Главная - Вопросы по программированию - Проверка пароля Javascript с помощью регулярного выражения

Проверка пароля Javascript с помощью регулярного выражения

#javascript

Вопрос:

я пытаюсь проверить поле пароля со следующими условиями, если требования выполнены, поле пароля должно изменить свой цвет на зеленый, если нет, должно быть красным: один символ нижнего регистра, один символ верхнего регистра, один номер, один специальный символ, минимум восемь символов.Я пытался использовать регулярное выражение, но каким-то образом оно становится красным, даже если я ввожу пароль со всеми требованиями. Есть идеи?

 let passwordField = document.getElementById("password");
passwordField.addEventListener("focusout", () => {
  let checkPass =
    /^(?=.*[a-z])(?=.*[A-Z])(?=.*d)(?=.*[@$!%*?amp;])[A-Za-zd@$!%*?amp;]{8,}$/;
  if (checkPass.test(password.value)) {
    passwordField.style.backgroundColor = "green";
    console.log("green");
  } else {
    passwordField.style.backgroundColor = "red";
    console.log("red");
  }
});

Комментарии:

1. Вы уверены, что хотите использовать регулярное выражение?

2. было бы лучше с регулярным выражением

Ответ №1:

Регулярное выражение должно быть:

 ^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^amp;*])(?=.{8,})

Где:

  1. нижний символ = (?=.*[a-z])
  2. верхний шар = (?=.*[A-Z])
  3. 1 число = (?=.*[0-9])
  4. специальный символ = (?=.*[!@#$%^amp;*])
  5. минимальная длина до 8 = (?=.{8,}) 
 let passwordField = document.getElementById("password");
passwordField.addEventListener("focusout", () => {
  let checkPass =
    new RegExp("^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^amp;*])(?=.{8,})");
  if (checkPass.test(password.value)) {
    passwordField.style.backgroundColor = "green";
    console.log("green");
  } else {
    passwordField.style.backgroundColor = "red";
    console.log("red");
  }
}); 
 <input id="password" />

И в результате получается:

введите описание изображения здесь

Комментарии:

1. все еще делает его красным

2. @EljanoHita проверьте изображение в моем ответе

3. @EljanoHita с каким паролем вы пытаетесь?

4. это должно быть что-то еще, чего мне не хватает в моем коде, потому что запуск кода snnipet работает нормально

5. Без проблем. Приятного кодирования =)

Ответ №2:

Пожалуйста, проверьте это, это точно то же самое, что вы хотите

     let passwordField = document.getElementById("password");
    passwordField.addEventListener("focusout", () => {
      var decimal=  /^(?=.*d)(?=.*[!@#$%^amp;*])(?=.*[a-z])(?=.*[A-Z]).{8,}$/;
      if (passwordField.value.match(decimal)) {
        passwordField.style.backgroundColor = "green";
        console.log("green");
      } else {
        passwordField.style.backgroundColor = "red";
        console.log("red");
      }
    }); 
 <!DOCTYPE html>
    <html lang="en">
    <head>
        <title>Password</title>
    </head>
    <body>

    <h1>This is a password validation</h1>
    <input id="password" />

    </body>
    </html>
Метки: