Атрибут target тега <form>

Описание

Атрибут target определяет, где будет открыт ответ сервера после отправки формы. Работает аналогично атрибуту target в теге <a>.

Пример использования:
<form action="/submit" method="post" target="_blank"> <input type="text" name="feedback"> <button type="submit">Отправить (откроется в новой вкладке)</button> </form>

Допустимые значения:

Значение Описание Применение
_blank Новое окно/вкладка Для открытия результатов в новом контексте
_self Текущее окно (по умолчанию) Обычная отправка формы
_parent Родительский фрейм Для форм во фреймах
_top Полное окно браузера Выход из всех фреймов
Имя фрейма Указанный фрейм/iframe Точное указание цели

Практические примеры:

<!-- Открыть в новом окне --> <form target="_blank">...</form> <!-- Отправить в указанный iframe --> <iframe name="resultFrame"></iframe> <form target="resultFrame">...</form> <!-- Отправить в родительский фрейм --> <form target="_parent">...</form>

Особенности работы:

  • Для _blank современные браузеры открывают новую вкладку
  • Можно комбинировать с rel="noopener" для безопасности
  • При использовании с AJAX игнорируется
  • Для файловых загрузок может использоваться скрытый iframe

Рекомендации по использованию:

  • Используйте _blank для сохранения текущей страницы
  • Избегайте _blank для форм входа (может блокироваться)
  • Для iframe указывайте конкретные имена фреймов
  • В SPA-приложениях обычно не требуется

Пример с обработкой в iframe:

<iframe name="form-response" style="display:none"></iframe> <form target="form-response"> <input type="text" name="data"> <button type="submit">Отправить</button> </form> <script> window.frames['form-response'].onload = function() { const response = this.document.body.innerHTML; console.log('Ответ сервера:', response); }; </script>

Ограничения:

  • Не работает с AJAX-отправкой форм
  • Поведение может отличаться в разных браузерах
  • Для сложных сценариев лучше использовать JavaScript

Примечание: В современных веб-приложениях атрибут target для форм используется редко, так как большинство разработчиков предпочитают обрабатывать отправку форм через JavaScript с AJAX. Однако он остается полезным для простых случаев и legacy-приложений.