Показать сообщение отдельно
  #2 (permalink)  
Старый 06.10.2017, 23:38
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Black_Star,
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
  .text_error {
    color: #f00;
  }

</style>
</head>
<body>
  <label class="field_item">
    <input class="input_login" type="text" placeholder="Login">
    <p class="about_item">Login</p>
    <p class="placeForComments"></p>
  </label>
  <label class="field_item">
    <input class="input_password" type="password" placeholder="Password">
    <p class="about_item">Password</p>
    <p class="placeForComments"></p>
  </label>

  <script>
    window.onload = function(){
      var loginInput = document.querySelector(".input_login"),
      passwordInput = document.querySelector(".input_password");

      loginInput.onblur = function() {
        var err = this.parentNode.querySelector(".placeForComments"),
            text = "" , metod = "remove";
       
        if (this.value.length < 5) {
          alert("too Short"); /// Сюда надо что-то умное
          text = "Очень маленький текст" ; metod = "add";
        };
        err.classList[metod]("text_error")
        err.textContent = text;

      };

    }
  </script>
</body>
</html>
Ответить с цитированием