Проверка заполнения полей формы. Яваскрипт.

Задачка такая: у меня есть продающий сайт, на нём форма заказа. Собственно в форме всего два поля имя и телефон, но некоторые недобросовестные создатели спамных роботов настолько криво пишут свой код, что видимо принимают мою форму за отправку комментариев и заваливают  мой почтовый ящик пустыми сообщениями.

Мои поля имя и телефон такие роботы заполняют всяким бредом, так что я собираюсь по этому признаку отфильтровать хорошие заказы от спама ещё на моменте отправки формы. И спам просто не отправлять себе )))

Честно признаюсь писать ява-скрипты я не умею от слова совсем. Но в данном случае без них не обойтись. Так что будем писать:

Как приделать к форме проверку полей?

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

<form id="zakazik" action="http://missudacha.ru/poslat/" method="post"  
onSubmit="return checkedForm(this)" >
Ваше имя:
<input class="text" type="text" name="tut_name" size="47" value="" />
<br />
Телефон:
<input class="text" type="text" name="tut_phone"  size="47" value="" />

//И т.д. поля формы

<input type="submit" value="Заказать"  />
</form>

Сразу за ним, пишем текст самой функции проверки:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function checkedForm(form){
// Сюда ставить блоки из описанных ниже
return true;
};
</script>

Блоки проверки вставляем уже по своим надобностям. Обратите внимание вы должны будете заменить на свои имя формы и имя поля !!!

Как проверить заполненность поля?

Допустим нам нужно проверить что поле в принципе чем-то заполнено. (Что пользователь туда что-то написал ). Тогда вставляем в нашу функцию такой блок:

if(!zakazik.tut_phone.value){
alert('Укажите телефон');
zakazik.tut_phone.focus();
return false;
};

Конкретно здесь я проверяю заполнен ли телефон

Как проверить, что в поле только буквы или только цифры?

Или например нам нужно проверить, что в поле присутствуют только нужные нам символы:

1. Только русские буквы:

if(! (/^[а-яА-ЯёЁ]+$/.test(zakazik.tut_name.value))){
alert('Напишите имя русскими буквами');
zakazik.tut_name.focus();
return false;
};

2. Только цифры причём именно от 10 до 12 символов:

if(! (/^[0-9]{10,12}$/.test(zakazik.tut_inn.value))){
alert('Не правильно введён ИНН');
zakazik.tut_inn.focus();
return false;
};

3. Только латинские буквы и цифры:

if(! (/^[a-zA-Z0-9]+$/.test(zakazik.tut_name.value))){
alert('Логин может включать в себя только цифры и латинские буквы');
zakazik.tut_name.focus();
return false;
};

4. Проверка правильности заполнения email:

if(! (/^[a-zA-Z0-9_\-\.]+@[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-\.]+$/.test(zakazik.tut_email.value)){
alert('Не правильно заполнен email');
zakazik.tut_email.focus();
return false;
};

Честно понимаю что это может быть не самый эффективный/красивый/удобный метод ))) Но спамеры мои на этих проверках обломались и меня сие полностью устроило.
Ну и если вдруг куда понадобится ещё хорошая шпаргалка получилась.

Редактировать:

Вы можете подписаться на новые посты этого блога: