Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   как получить значение псевдокласса :valid/:invalid ? (https://javascript.ru/forum/events/69704-kak-poluchit-znachenie-psevdoklassa-valid-invalid.html)

persikova 13.07.2017 17:36

как получить значение псевдокласса :valid/:invalid ?
 
Есть форма с инпутами, валидация которых должна осуществляться браузером с помощью регулярных выражений, например:

<form class="form1">
<input required type="email" name="email" pattern="\S+@[a-z]+.[a-z]+" oninput="validateComments(this)">
</form>

Пытаюсь с помощью js получить значение, пройдена ли эта валидация
<script type="text/javascript">
function validateComments(input) {
console.log(input.prototype.valid);
}
</script>

но при такой записи (как и при всех других моих попытках) получаю undefined.

как получить значение псевдокласса input, :valid/:invalid ?

Dilettante_Pro 13.07.2017 18:39

Косвенная проверка псевдокласса
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>:valid</title>
  <style>
   input:invalid {
    background: #fdd; /* Красный цвет фона */
   }
   input:valid {
    background: #dfd; /* Зеленый цвет фона */
   }
  </style>
 </head>
 <body>
  <form>
     <input required type="email" name="email" pattern="\S+@[a-z]+.[a-z]+" oninput="validateComments(this)">
  </form>
<script type="text/javascript">
function validateComments(input) {
   console.log(getComputedStyle(input).backgroundColor);

}
</script>
 </body>
</html>

рони 13.07.2017 19:22

:write: а если так?
console.log(input.validity.valid);

persikova 13.07.2017 19:46

Dilettante_Pro, как вариант, спасибо! :)

persikova 13.07.2017 19:47

Цитата:

Сообщение от рони
console.log(input.validity.valid);

а вот это именно то, чего хотелось! работает, спасибо!)))

laimas 13.07.2017 20:00

persikova,
все здесь об этом.

Dilettante_Pro 14.07.2017 10:09

Цитата:

Сообщение от рони
console.log(input.validity.valid);

Да, надо HTML5 внимательнее изучать...


Часовой пояс GMT +3, время: 17:05.