Интересный Javascript. Кто-нибудь знает что-то подобное?

Интересная форма отправки сообщений на странице сайта view-source:http://***ru/
Поля email, phone, и textarea как-то объединены, при этом форма проверяет, отправляете вы просто сообщение, или с координатами.
У кого-нибудь есть догадки, как это сделано?
Форма довольно привлекательна с точки зрения окупаемости (ленивых клиентов много, такая форма -большой помощник).

Ольга

07 апреля 2018, 01:17

1 092

Комментарии: 3

Алексей Суслов

07 апреля 2018, 05:01

Так вроде там ничего особенного нет, это проста форма с одним полем, можно отправить тестовую заявку и увидеть, что все данные отправляются одной строкой в переменной body.
И лишь 2 простых функции javascript, которые проверяют ваше сообщение с помощью регулярных выражений: на ввод телефона или на ввод почты и еще проверка на отправку пустой формы.

function checkIfEmailInString(StrObj){var emailsArray=StrObj.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z0-9._-]+)/gi);if(emailsArray!==null&&emailsArray.length){return true;}
return false;}

function checkIfPhoneInString(string){return string.match(/([0-9]+)/)!==null;}

$frm.on('submit',function(e){e.preventDefault;if(!isCompleted){return false;}
isCompleted=false;$errors.hide().html('');if(!$body.val()){$errors.html('Укажите имя и контактные данные').show();isCompleted=true;return false;}

if(!checkIfEmailInString($body.val())&&!checkIfPhoneInString($body.val())){$errors.html('Укажите email или телефон').show();isCompleted=true;return false;}
return true;});}

Эта форма пропустит довольно много ошибочных или мусорных заявок, можно написать просто любое число, например 77, и она отправится, так как нет проверки на минимальную длину или на правильность ввода телефона. Все проверки сводятся к тому, чтобы хоть что-то было введено в форму и чтобы в этом что-то было что-то похожее на телефон или почту.

Ольга

07 апреля 2018, 05:31

Спасибо!
Она будет работать с Formit?

Алексей Суслов

07 апреля 2018, 05:36

Javascript без разницы с чем работать, лишь бы код подходил к вашему коду формы.
Вот например переменные с того сайта, они разумеется должны соответствовать классам вашей формы:

var $frm=$element.find('.js-from-main__frm');
var $body=$element.find('.js-from-main__body');
var $errors=$element.find('.js-from-main__errors');
var isCompleted=true;

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.