Валидация формы
Здравствуйте! Подскажите, пожалуйста, почему не работает скрипт?
Проверка поля имени работает, а проверка email нет. Скрипт не дает писать вообще никаких символов в инпуте.
function nameAndEmailCheck() {
//Функия принимает в качестве параметров id и регулярное выражение
function inputCheck(id, regex) {
//Первым параметром является выбранный по id элемент
let element = document.getElementById(id);
if (element) {
let lastValue = element.value; //Получение значения инпута
if (!regex.test(lastValue)) {
//Проверка соответтсвия значения инпута регулярному выражению
lastValue = ''; //В случае несоответтсвия инпут очищается
}
setInterval(function () {
//Функия проверки срабатывает через заданный интервал
let value = element.value; //Присвоение переменной значения инпута
if (value != lastValue) {
//Сравнение текущего и последнего значения инпута
if (regex.test(value)) {
//В случае соответсвия значения инпута реугялрному выражению
lastValue = value; //Предыдущее значение инпута принимает его текущее значение
} else {
element.value = lastValue; //В противном случае значение инпута становится равным последнему значению
}
}
}, 10); //Интервал срабатывания функции
}
}
; //Проверка поля ввода имени в popup-design
inputCheck('name-first', /^[а-яёА-яЁ\s]*$/);
inputCheck('name-second', /^[а-яёА-яЁ\s]*$/);
inputCheck('email-first', /^[A-z0-9_.-]{1,}@([A-z0-9_.-]{1,}).([A-z]{2,8})*$/);
inputCheck('email-second', /^[A-z0-9_.-]{1,}@([A-z0-9_.-]{1,}).([A-z]{2,8})*$/);
}
nameAndEmailCheck();
<div class="input-blocks-wrap">
<div class="input-block">
<input class="name-first" id="name-first" type="text" name="name" placeholder="Ваше имя" required>
</div>
<div class="input-block">
<input class="phone-first" id="phone-first" type="text" name="phone" placeholder="Ваш телефон" required>
</div>
<div class="input-block">
<input class="email-first" id="email-first" type="email" name="email" placeholder="Ваша почта" required>
</div>
<button class="form__submit" type="submit" id="first-form__submit">Заказать консультацию</button>
<div class="input-blocks-wrap">
<div class="input-block">
<input class="name-second" id="name-second" type="text" name="name" placeholder="Ваше имя" required>
</div>
<div class="input-block">
<input class="phone-second" id="phone-second" type="text" name="phone" placeholder="Ваш телефон" required>
</div>
<div class="input-block">
<input class="email-second" id="email-second" type="email" name="email" placeholder="Ваша почта" required>
</div>
<button class="form__submit" type="submit" id="second-form__submit">Заказать консультацию</button>
|
DVV,
а нельзя как-то без setInterval освоить js, для вашего случая есть события oninput и onchange. |
можно, наверное, просто я этим скриптом давно пользуюсь. но тут что-то накосячил с email
|
|
Надо ли делать такие проверки?
Тем более, если они не совсем правильные. Как пройдет проверку Фамилия "Голицин-Трубецкой"? Про e-mail я уж не говорю. По стандарту допустимы адреса disposable.style.email.with+symbol@example.com " "@example.org "john..doe"@example.org mailhost!username@example.org А по совсем новым стандартам и медведь@с-балалайкой.рф δοκιμή@παράδειγμα.δοκιμή Pelé@example.com 買 買 @ 屋企. 香港 https://en.wikipedia.org/wiki/Email_address |
| Часовой пояс GMT +3, время: 02:35. |