Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.04.2020, 13:37
DVV DVV вне форума
Кандидат Javascript-наук
Отправить личное сообщение для DVV Посмотреть профиль Найти все сообщения от DVV
 
Регистрация: 26.12.2017
Сообщений: 125

Валидация формы
Здравствуйте! Подскажите, пожалуйста, почему не работает скрипт?
Проверка поля имени работает, а проверка 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>
Ответить с цитированием
  #2 (permalink)  
Старый 08.04.2020, 13:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,072

DVV,
а нельзя как-то без setInterval освоить js, для вашего случая есть события oninput и onchange.
Ответить с цитированием
  #3 (permalink)  
Старый 08.04.2020, 13:52
DVV DVV вне форума
Кандидат Javascript-наук
Отправить личное сообщение для DVV Посмотреть профиль Найти все сообщения от DVV
 
Регистрация: 26.12.2017
Сообщений: 125

можно, наверное, просто я этим скриптом давно пользуюсь. но тут что-то накосячил с email
Ответить с цитированием
  #4 (permalink)  
Старый 08.04.2020, 14:06
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,072

DVV,
Выделение инпутов и сообщения о необходимости заполнить пустые поля
Ответить с цитированием
  #5 (permalink)  
Старый 08.04.2020, 15:41
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,707

Надо ли делать такие проверки?
Тем более, если они не совсем правильные.
Как пройдет проверку Фамилия "Голицин-Трубецкой"?
Про 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
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Валидация веб формы giovanni Events/DOM/Window 3 01.09.2017 15:49
AngularJS валидация веб формы giovanni Angular.js 1 28.08.2017 07:07
Валидация формы работает не совсем так Batyabest Events/DOM/Window 12 26.11.2016 02:07
Валидация формы Mick_20 Общие вопросы Javascript 6 11.10.2014 22:29
Валидация формы dmsuslov jQuery 4 05.11.2010 16:12