Создание кнопок с помощью тегов ввода HTML в формах

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

Установив атрибуттип к «кнопке» генерируется простая кликабельная кнопка. Вы можете определить текст, который будет отображаться на кнопке, например «Отправить», с помощью значение атрибут. Например:


В Вход тег не отправит HTML-форму; вы должны включить JavaScript для обработки отправки данных формы. Без JavaScript по щелчку , кнопка будет казаться кликабельной, но ничего не произойдет, и вы разочаруете своих читателей.

Альтернатива тега 'button'

Хотя используя Вход тег для создания кнопки работает по своему назначению, лучше использовать кнопка тег для создания HTML-кнопок вашего сайта. В кнопка тег более гибкий, потому что он позволяет использовать изображения для кнопки (что помогает сохранить визуальную согласованность, если ваша сайт имеет тему дизайна), например, и его можно определить как кнопку типа отправки или сброса без каких-либо дополнительных JavaScript.

Укажите кнопку тип атрибут в любом кнопка теги. Есть три разных типа:

instagram viewer
  • кнопка: Кнопка не имеет внутреннего поведения, но используется вместе со скриптами, которые выполняются на стороне клиента, которые могут быть прикреплены к кнопке и выполнены при ее нажатии.
  • сброс настроек: Сбрасывает все значения.
  • представить: Кнопка отправляет данные формы на сервер (это значение по умолчанию, если тип не определен).

Другие атрибуты включают:

  • название: Дает кнопке ссылочное имя.
  • значение: Указывает значение, которое будет изначально присвоено кнопке.
  • запрещать: Выключает кнопку.

Дальше с кнопками

HTML5 добавляет дополнительные атрибуты к кнопка тег, расширяющий его функциональность.

  • автофокус: Когда страница загружается, этот параметр указывает, что эта кнопка находится в фокусе. На странице можно использовать только один автофокус.
  • форма: Связывает кнопку с определенной формой в том же HTML-документе, используя идентификатор формы в качестве значения.
  • форма действия: Используется только с type = "submit" и URL-адрес в качестве значения, он указывает, куда будут отправлены данные формы. Часто местом назначения является PHP-скрипт или что-то подобное,
  • formenctype: Используется только с type = "submit" атрибут. Определяет, как данные формы должны кодироваться при отправке на сервер. Три значения: приложение / x-www-form-urlencoded (По умолчанию), multipart / form-data, а также текст / простой.
  • формаметод: Используется только с type = "submit" атрибут. Это указывает, какой HTTP-метод использовать при отправке данных формы, либо получать или же Почта.
  • формовать: Используется только с type = "submit" атрибут. При отправке данные формы не проверяются.
  • formtarget: Используется только с type = "submit" атрибут. Это указывает, где должен отображаться ответ сайта при отправке данных формы, например, в новом окне и т. Д. Возможные варианты значений:_blank, _self, _parent, _top, или конкретное имя фрейма.

Узнать больше о создание кнопок в HTML-формах, а также как сделать ваш сайт более удобным для пользователей.