О web-разработке
и даже немного больше...

Отправка формы через ссылку

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

...
<input type="submit" value="Отправить"/>
...

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

Форма:

...
<form method="post" id="form1">
</form>
...

Ссылка:

<a href="#" onclick="document.getElementById('form1').submit(); return false;">Отправить</a>

Итак, смотрим что сделали. Форме задали id="form1", таким образом, мы обращаемся к форме через id, с помощью document.getElementById() (метод объекта document), отправляя форму методом submit().
Из недостатков данного способа отправки формы следует отметить следующее:
1. Если поддержка javascript отключена в браузере, то соответственно код не сработает – форма не отправляется.
2. Javascript — далеко не самый быстрый язык, и getElementById — не исключение. Хотя эта функция и является самой эффективной для поиска элемента, она включает дорогостоящие обращения к DOM, объектной модели документа.

Из плюсов, конечно, гибкость в плане стилизации формы.

Опубликован: 12.07.2013 г.

См. также:

Делаем кнопки «Поделиться в соцсетях»
Стрелочные функции в JS
Мобильное меню для сайта на CSS
Опасность использования атрибута target="_blank"
Бесконечная анимация вращения на CSS
Анимация вращения при наведении курсора
Стилизация выделения номера телефона в мобильных браузерах
Эффекты кнопок для сайта

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Комментарии
  • Загрузка...
Друзья сайта