Главная
Блог разработчиков phpBB
 
+ 17 предустановленных модов
+ SEO-оптимизация форума
+ авторизация через соц. сети
+ защита от спама

Как отправить e-mail сообщение со страницы сайта.

Viktor | 24.02.2014 | нет комментариев

Для того чтобы отправить сообщение по электронной почте совсем не обязательно набирать его непосредственно в почтовой программе, а можно это сделать, воспользовавшись специальной формой на web-странице. При этом конечно же на Вашем компьютере почтовая программа должна быть установлена и настроена.

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

Имя:
Тема:
Сообщение:

А теперь давайте рассмотрим код, с помощью которого формируется эта форма:

Листинг 14.1.

<FORM NAME=”mailer” METHOD=”post” ACTION=”" ENCTYPE=”text/plain” onSubmit=”(document.mailer.action += mailtoandSubject)”>
<table border=2 align=center cellspacing=1 cellpadding=2 BgColor=#000FFF>
<tr><td><FONT size=”2″ color=”#FFFFFF”>Имя:</font></td>
<td><INPUT TYPE=”text” NAME=”Name” size=”24″ onChange=”msg(this.form)”></td></tr>
<tr><td><FONT size=”2″ color=”#FFFFFF”>Тема:</font></td>
<td><INPUT TYPE=”text” NAME=”Subject” size=”24″ onChange=”msg(this.form)”></td></tr>
<tr><td><FONT size=”2″ color=”#FFFFFF”>Сообщение:</font></td>
<td><TEXTAREA NAME=”Message” COLS=40 ROWS=6 onChange=”msg(this.form)”></TEXTAREA></td></tr>
<tr><td colspan=2 align=center><INPUT TYPE = “submit” VALUE = “Отправить” ONCLICK=”return checkIt()“>
<INPUT TYPE=reset VALUE=” Сброс “></td></tr></table>
</FORM>

Любая форма на web-странице формируется с помощью парных тегов <form> </form> , далее указывают метод передачи METHOD в данном случае используется метод POST.

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

Название полей формы: Имя, Тема и Сообщение (левый столбец) -это обычный текст, которому придается цвет и размер, вспомнить можно здесь. А вот сами поля куда вводятся значения (правый столбец таблицы) формируется с помощью тегов INPUT c атрибутами TYPE у которых должны быть обязательный значения, в данном случае это простой текст, поэтому – “text” .

В последнем ряду мы видим две кнопки, которые формируются значениями INPUT TYPE = “submit” VALUE = “Отправить”и INPUT TYPE=reset VALUE=” Сброс “. Как видите все очень просто.

Кроме того можно добавить код проверки на заполнение всех полей, добавляем на web-страницу вот такой код:

Листинг 14.2.

<SCRIPT LANGUAGE=”JavaScript”>
function checkIt() { // функция проверки полей формы
//———–
if (document.forms.mailer.Name.value != “”) { // функция проверки поля Name
} else {
alert(“\nОбласть \”Имя\” в форме. \n\nПожалуйста, введите свое имя.”); // выводит сообщение, если поле Name не заполнено
document.forms.mailer.Name.focus(); // возврашает курсор на поле Name
return false;
}
//———–
if (document.forms.mailer.Subject.value != “”) { // функция проверки поля Subject
} else {
alert(“\nОбласть \”Тема\” в форме. \n\nПожалуйста, введите тему.”); // выводит сообщение, если поле Subject не заполнено
document.forms.mailer.Subject.focus(); // возврашает курсор на поле Subject
return false;
}
//———–
if (document.forms.mailer.Message.value != “”) { // функция проверки поля Message
return true; // ВСЕ ОТЛИЧНО
} else {
alert(“\nОбласть \”Сообщение\” в форме. \n\nПожалуйста, напишите сообщение.”); // выводит сообщение, если поле Message не заполнено
document.forms.mailer.Message.focus(); // возврашает курсор на поле Message
return false;
}
//———–
}
function msg() { // функция отправки
document.mailer.action = “mailto:Ваша@почта.ru
mailtoandSubject = ((‘?Subject=’ + document.mailer.Subject.value) + ‘&Body=’ + document.mailer.Message.value);
}
</SCRIPT>

Смените значение переменной Ваша@почта.ru на e-mail адрес Вашей почты, куда будут приходить заполненные формы. Данная форма содержит поля ИМЯ, ТЕМА и СООБЩЕНИЕ. Разумеется, вы можете изменить названия этих полей, а также добавить/удалить новые строчки. При этом нужно будет внести некоторые изменения в программу проверки/отправки сообщения.

Каждому полю формы присвоено определенное имя, которое задано атрибутом NAME. При нажатии на кнопку “Отправить” происходит вызов функции checkIt(). Если поле не заполнено выводиться окно с сообщением с кнопкой Ok, после нажатия на которую курсор переходит на незаполненное поле. Остальные функции проверки работают также (я разделил их вот таким комментарием //———–, чтобы Вам было удобнее добавлять или удалять функции). Последняя функция должна содержать значение return true;. Именно это значение уведомляет об успешном окончании проверки и завершает проверку полей формы, так что решать, где его поставить – Вам.

Внимание: Такие формы использует почтовую программу пользователя и, если она не настроена, ничего не отправится.

АВТОРСКИЕ ПРАВА
Источник: luksweb.ru
При перепечатке ссылка на источник обязательна
Оставить комментарий
БАЗА ЗНАНИЙ
СЛУЧАЙНАЯ СТАТЬЯ
СЛУЧАЙНЫЙ БЛОГ
СЛУЧАЙНЫЙ МОД
СЛУЧАЙНЫЙ СКИН
НОВЫЕ МОДЫ
НОВЫЕ СКИНЫ
НАКОПЛЕННЫЙ ОПЫТ
Форум phpBB, русская поддержка форума phpBB
Рейтинг@Mail.ru 2008 - 2017 © BB3x.ru - русская поддержка форума phpBB