JavaScript+jQuery.
Проверка корректного ввода е-мейл
Совместное использование обычного JavaScript и только лишь ядра библиотеки jQuery,
позволяет написать интересный скрипт, который будет проверять корректность ввода е-мейл в соответствующее поле формы для заказа.
Прописал такой код для проверки поля e-mail в своей форме расчёта стоимости проката. (!)И ещё кое-что он сделает.
Подробности под формой.
На данный момент к прокату доступны следующие модели:
- Харлей Дэвидсон
- Кроссовый мотоцикл
- Гоночный мотоцикл
- Концептуальный мотоцикл
Ссылки на сайты производителей и спецификации мотоциклов:
Расчёт стоимости проката мотоциклов:
Проверка корректного ввода е-мейл и блокировка повторной отправки
Цель создания данной страницы - написать и проверить работу интересного скрипта, который "на лету" проверял бы поля формы на соответствие вводимого установленному шаблону. Кроме того, он должен был блокировать повторную отправку сообщения.
Очень часто встречаю на разных сайтах подобные методы совместного использования простого JavaScript + jQuery.
Первая строчка скрипта содержит регулярное выражение JavaScript, которому должен соответствовать введённый е-мейл.
Соответствовать - означает: быть похожим на настоящий.
Правильный/неправильный - это дело заказчика, НО(!), хотя бы похожим
на name@domen.ru (всё равно: .ru .com .mail .net и т.д.).
Дальше - берём это регулярное выражение в глобальную переменную, и в дело вступает jQuery.
С помощью метода JavaScript .search (искать) проверяем эту глобальную переменную, в которую взяли регулярное выражение.
Если .search() НЕ найдёт соответствия, вернёт -1 <- Используем это для дальнейшего составления кода,
применив обычную конструкцию JavaScript else - if - else, что позволит сделать остальное.
Результат - О.К! Можно пробовать.
Если ввести "неправильный" е-мейл, типа: 12345, abcde, без @, или концовку как-нибудь "наврать", то, при уходе с этого поля, (кликнуть на другое поле, или рядом) вокруг появится красная рамка, если же всё нормально, рамка будет зелёного цвета.
Кроме того!
Нажав на кнопку "ОТПРАВИТЬ ЗАЯВКУ", сообщение, как бы отправится, и надпись на кнопке станет: "УЖЕ ОТПРАВЛЕНО!", а сама кнопка станет
"неактивной", т.е. заблокируется от повторного использования.
* * *
P.S.**
Даже, если кликнуть по кнопке "ОТПРАВИТЬ ЗАЯВКУ", а поля формы вообще НЕ заполнять, она всё равно изменится и "скажет",
что "УЖЕ ОТПРАВЛЕНО!", и заблокируется.
Никуда, и ничего НЕ отправлялось!
Это скрипт так шутит. 
Ну, а серьёзно.
Не стал до конца прописывать, чтобы, и поле текста проверялось - заполнено ли, и сам заказ отправлялся бы.
Для этого нужно было бы ещё приличный кусок кода вставлять.
Меня же интересовало лишь одно: проверка корректного ввода е-мейл, и блокировка кнопки от повторного использования.
Мотоциклы на продажу (б/у):
| Модель | Цена |
|---|---|
| Харлей Дэвидсон | 25000 |
| Кроссовый мотоцикл | 10000 |
| Мотоцикл Сузуки | 15000 |
